问题
我正在尝试从指令模板中单击带有radio
的value="agency"
输入,其最终目标是更改范围变量newDatasourceType
。
相关来源
指令模板
<div ng-if="!datasources" class="new-datasource">
<input name="agencyOrWidget" type="radio" ng-model="newDatasourceType" value="agency" />
<label>Agency</label>
<input name="agencyOrWidget" type="radio" ng-model="newDatasourceType" value="widget" />
<label>Widget</label>
<select ng-if="newDatasourceType=='widget'" name="{{inputPrefix}}[0][widget_id]">
<option>Choose a widget...</option>
<option ng-repeat="(id, options) in widgetList" value="{{id}}">{{id}}</option>
</select>
<select ng-if="newDatasourceType=='agency'" name="{{inputPrefix}}[0][agency_id]">
<option>Choose an agency...</option>
<option ng-repeat="(id, name) in agenciesList" value="{{id}}">{{name}}</option>
</select>
</div>
相关单元测试
注释中包含尝试的部分和注释。
it('Select Agencies', function() {
// Running this to see if it does anything
scope.newDatasourceType = 'agency';
//create the element with the directive template
elem = $compile(directive)(scope);
scope.$digest();
// Returns `1`
console.log(elem.find('input[value="agency"]').length);
// elem.find('input[value="agency"]').triggerHandler('click');
elem.find('input[value="agency"]').click(function() {
// Doesn't get triggered
console.log('click');
});
// Didn't do anything...
// scope.$digest();
// scope.$apply();
// console.log(elem.html());
// Test items
expect(elem.find('select option:nth-child(2)').val()).toBe(Object.keys(scope.agenciesJson)[0]);
});
我所看到的
无论我手动设置
newDatasourceType
还是尝试单击它,只有带有Choose a widget...
的选择块都可见。 最佳答案
除了触发checked
事件外,还必须更改单选按钮上的click
属性。这是一个http://jsfiddle.net/k1axxs21/1/示例