自定義指令的角度ng重複

我很難從我的控制器範圍傳遞到自定義指令的數據。 ng-repeat給了我正確數量的元素，它只是不加載模板或其他東西。自定義指令的角度ng重複

angular.module('myApp') 
.controller('WorkflowController', ['$scope', function($scope){ 
    $scope.columns = ['Requested Quote', 'Quote Sent', 'Deposit Paid']; 
}]) 
.directive('kanban-column', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: {column: '='}, 
    templateUrl: 'directives/kanban-column/template.html' 
    } 
}) 

// template.html: 
<h4>{{column}}}}</h4>

有了這個在我的index.html：

<div class='kanban-board'> 
    <kanban-column data-ng-repeat="column in columns" data-column="column"> 
    </kanban-column> 
</div>

代碼簡化了一下，不過您甚至逐字上述不起作用。我可以忽略一些東西嗎

來源

2015-11-03 Wes Tyler

行不通的意思？你確定數據從那裏返回？ –

template.html中的內容是什麼？ –

template.html只是

–

首先你沒有通過dependency在your app所以它永遠不會實例化。

angular.module('myApp',[]).controller('WorkflowController', ['$scope', function($scope){ 
    $scope.columns = ['Requested Quote', 'Quote Sent', 'Deposit Paid']; 
}]).directive('kanbanColumn', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: {column: '='}, 
    template: '<h4>{{column}}</h4>' 
    } 
});

試試這個。

<div class='kanban-board'> 
    <div data-ng-repeat="column in columns"> 
     <kanban-column data-column="column"> 
     </kanban-column> 
    </div> 
</div>

Working plunkr

來源

2015-11-03 05:36:11 ngLover

試試這個代碼

HTML：

<!DOCTYPE html> 
<html ng-app="myApp"> 

<head> 
    <meta charset="utf-8"> 
    <title>AngularJS Plunker</title> 
    <script> 
    document.write('<base href="' + document.location + '" />'); 
    </script> 
    <link rel="stylesheet" href="style.css"> 
    <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script> 
    <script data-require="[email protected]" src="http://code.angularjs.org/1.1.5/angular.min.js" data-semver="1.0.7"></script> 
    <script src="app.js"></script> 

</head> 

<body> 
    <div ng-controller="WorkflowController"> 
    <div class='kanban-board'> 
     <kanban-column data-ng-repeat="column in columns" data-column="column"> 
     </kanban-column> 
    </div> 
    </div> 
</body> 

</html>

JS：

angular.module('myApp', []) 
    .controller('WorkflowController', ['$scope', function($scope) { 
    $scope.columns = ['Requested Quote', 'Quote Sent', 'Deposit Paid']; 
    }]) 
    .directive('kanbanColumn', function() { 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: { 
     column: '=?' 
     }, 
     templateUrl: 'template.html' 
    }; 
    }); 

template.html: 
<h4>{{column}}</h4>

來源

2015-11-03 06:05:39 Shohel

自定義指令的角度ng重複

{{列}}

回答

自定義指令的角度ng重複

{{列}}

回答

相關問題