1
私はangularJSのコンポーネントパターンを学習しています。私はコンポーネントパターンでバインディングを使用しようとしています。私が使用したバインディング名はfirstnameです。しかし、問題はそれが拘束力がないということです。 ファーストネームをabcのようなものに置き換えたとき、正常に動作します。誰でもその問題を引き起こしたと言えるでしょうか?このコンポーネントを呼び出すAngularJSコンポーネントパターンのバインディングには、特定の命名形式がありますか?
(function() {
angular.module('mainModule').component('heroList', {
template: '<p>Hello from component {{$ctrl.firstName}}</p>',
//controller: 'HeroListController',
bindings: {
firstName: '='
}
})
}());
のindex.htmlとindex.jsである:
(function() {
var app= angular.module('mainModule', []);
app.controller('myCtrl', function() {
var vm = this;
vm.firstName = "John";
vm.lastName = "Doe";
})
}())
<!DOCTYPE html>
<html>
<head>
<title>Angular Components</title>
<script src="scripts/angular.min.js"></script>
<script src="index.js"></script>
<script src="heroes/hero-list.component.js"></script>
<script src="heroes/hero-list.controller.js"></script>
</head>
<body ng-app="mainModule" ng-controller="myCtrl as vm">
{{vm.firstName}} {{vm.lastName}}
<hero-list firstName="vm.firstName"><hero-list>
</body>
</html>
成分コードは以下のとおりであります
> John Doe
>
>Hello from component
しかし、私はABCでfirstNameのを交換した後、私は、所望の出力を得る:私が手に出力されます。
>John Doe
>
>Hello from component John
この問題を引き起こした原因を教えてもらえますか?