Question

在我的剃刀视图中，我有一张表格如下：

<form>
    <table class="table">
        <thead><tr>
                   <th>Artist Name</th>
                   <th>Track Title</th>
                   <th>Version</th>
                   <th>Track Duration</th>
                   <th>Recording Year(20xx)</th>
                   <th></th>
               </tr>
        </thead>
        <tbody>
            <tr isrcrow> </tr>

       </tbody>

这是“isrcrow”的指令

isrcorderapp.directive "isrcrow", () ->
    restrict:'A'
    template: '<td><input id="artist" ng-model="artist"/></td>
                <td><input id="title" ng-model="title"/></td>
                <td><select id="isrctype" ng-model="isrctype" ng-change="setState(state)" ng-options="s.type for s in recordingTypes" class="ng-pristine ng-valid"></select></td>
                <td><input id="duration"/></td>
                <td><input id="year"/></td>
                <td><input type="button" value="Add ISRC" onclick="AddIsrc()" class="btn btn-small btn-success" />
                    <input type="button" value="Delete" onclick="RemoveIsrc()" class="btn btn-small btn-danger" />
                </td>'
    replace: false
    scope:
        name:'='
        ng-options=''

    link: (scope,element,attr) ->

isrcorderapp.controller "isrcorders", ($scope,$http) ->
    $scope.recordingTypes = [
        {type:'A'}
        {type:'B'}
        {type:'C'}
        {type:'D'}
        {type:'E'}
        ]

当表格被渲染时，它不会填充选择列表。

问题可能是范围属性。

如何在范围内引用模板的这一部分： ng-options =“recordTypes中s的s.type”class =“ng-pristine ng-valid”

我不清楚何时使用=或@

Answer 1

我把原始代码放入了一个plunker。控制器没有在指令中指定（除非它在你的DOM中更高的位置？）。据我所知，指令中的隔离范围不是必需的，可以删除。

http://plnkr.co/edit/smL8FX6hmUAqSrXjOlSj?p=preview

<tbody>
    <tr isrcrow> </tr>
</tbody>

var isrcorderapp = angular.module('plunker', []);

isrcorderapp.directive("isrcrow", function(){
  return {
    restrict:'A',
    controller: 'isrcorders',
    template: '<td><input id="artist" ng-model="artist"/></td>\
                <td><input id="title" ng-model="title"/></td>\
                <td><select id="isrctype" ng-model="isrctype" ng-change="setState(state)" ng-options="s.type for s in recordingTypes" class="ng-pristine ng-valid"></select></td>\
                <td><input id="duration"/></td>\
                <td><input id="year"/></td>\
                <td><input type="button" value="Add ISRC" onclick="AddIsrc()" class="btn btn-small btn-success" />\
                    <input type="button" value="Delete" onclick="RemoveIsrc()" class="btn btn-small btn-danger" />\
                </td>',
    replace: false
  }
});

isrcorderapp.controller("isrcorders", function($scope,$http) {
    $scope.recordingTypes = [
        {type:'A'},
        {type:'B'},
        {type:'C'},
        {type:'D'},
        {type:'E'}
        ];
});

如何使用角度指令范围

1 个答案: