我的AngularJS代码存在问题。
似乎我无法从我的控制器访问我的指令范围。
指令
app.directive('PaginatedText', function(){
return {
restrict: 'E',
scope: {
text: '='
},
controller: 'PaginatedTextController',
templateUrl: '/frontend/views/paginated-text.html'
};
})
控制器
app.controller('PaginatedTextController', ['$scope', function($scope){
$scope.page = 1;
$scope.limit = 200;
console.log($scope, $scope.text);
}]);
指令调用
<paginated-text text="character.long_description"></paginated-text>
模板
<p>
{{text}}
<button>read more</button>
</p>
打印的console.log:
知道为什么console.log($scope.text)
打印未定义?
答案 0 :(得分:0)
指令名称必须以小写字母开头!
app.directive('paginatedText',
angular.module('app', [])
.run(function($rootScope) {
$rootScope.character = {
long_description: 'LirumLarum'
};
})
.directive('paginatedText', function() {
return {
restrict: 'E',
scope: {
text: '='
},
controller: 'PaginatedTextController',
template: '<p>{{text}}<button>read more</button></p>'
};
})
.controller('PaginatedTextController', ['$scope',
function($scope) {
$scope.page = 1;
$scope.limit = 200;
console.log($scope, $scope.text);
}
]);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"></script>
<div ng-app="app">
<paginated-text text="character.long_description"></paginated-text>
</div>
&#13;