我有 4 个基于 var.type 的模板。我有 2/4 显示正确,但由于某些原因,其中 2 个没有渲染任何内容。在 HTML 中,我看到开关已正确激活,但指令未按预期放置在内部。
angular.module('lodgicalWebApp');
angular.module('lodgicalWebApp')
.directive('lodReportVariableCgflookup', function () {
return {
template: '{{var.name}}<label for="repeatSelect"> {{var.name}} </label> \
<select name="repeatSelect" ng-model="Vars[var.name]" id="repeatSelect" ng-model="data.repeatSelect"> \
<option ng-repeat="option in var.possibleVals" value="{{option.id}}">{{option.name}}</option> \
</select>',
restrict: 'EA'
};
});
angular.module('lodgicalWebApp')
.directive('lodReportVariableBoolean', function () {
return {
template: '{{var.name}}<input ng-model="Vars[var.name]" type="checkbox" ng-true="{{var.value}}">',
restrict: 'EA',
};
});
angular.module('lodgicalWebApp')
.controller('ReportsCtrl', function ($scope, $routeParams, LodgicalReportService, Report) {
$scope.selectedReport.variables = [
{name: "Start Date",possibleVals:[],type: "Date", value: "2016-01-18"},
{name: "Operator",possibleVals: [{id:1,name:"test"},{id:2,name:"thanksStackOverflow"}], type: "CfgLookup"},
{name: "Include Security Deposits", type: "Boolean", value: "False"}
]
});
<div ng-repeat="var in selectedReport.variables">
<div ng-switch="var.type">
<!-- CfgLookup not rendering -->
<div ng-switch-when="CfgLookup" data-lod-report-variable-cfglookup ></div>
<div ng-switch-when="Boolean" data-lod-report-variable-boolean></div>
<div ng-switch-when="Date" data-lod-report-variable-date ></div>
<div ng-switch-when="CfgLookup-Multi" data-lod-report-variable-cfglookup></div>
</div>
</div>
这不是一个有效的示例,但它应该足以说明这一重大挫折。
提前致谢。
最佳答案
你有一个打字错误,肯定会弄乱它:
“data-lod-report-variable-cfglookup”是您在 HTML 代码中编写的指令名称,而 JS 代码中的指令名称是“lodReportVariableCgflookup”。 (cfglookup 与 cgflookup)
编辑:此外,我注意到您在您所说不起作用的两个指令上使用了相同的指令“lodReportVariableCgflookup”。
您可能还遇到另一个问题,但我会从这个问题开始:)
关于javascript - Angular 指令未显示在 ng-Switch 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34860380/