如何使用角行指令

Question

我試圖使用角行指令追加行到表中的行追加到表：

這裏是plunker： http://plnkr.co/edit/RFT5e5kbdCJdpPLWUqFD?p=preview

當我點擊「添加Isrc」按鈕應該添加一個新行，但它不起作用。

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'} 
     ]; 

    $scope.AddIsrc = function() { 
     var e; 
     $('#isrctable tbody').append('<tr isrcrow> </tr>'); 
     return e = ''; 
    }; 



}); 

Answer 1

onclick="AddIsrc()"必須ng-click="AddIsrc()"調用上的$範圍的方法。

在Plunker上也缺少jQuery，必須添加。

行需要以編譯爲指令執行...

isrcorderapp.controller("isrcorders", function($scope, $http, $compile) { 

    // ... 

    $scope.AddIsrc = function() { 
     var e; 
     var tr = $('<tr isrcrow> </tr>'); 
     $('#isrctable tbody').append(tr); 
     $compile(tr)($scope); 
     return e = ''; // not sure what this is 
    }; 
}); 

更新plunker：http://plnkr.co/edit/oxXZlsFIDAbBCYMDOYMH?p=preview