ale*_*ger 5 html data-binding angularjs angular-components
我试图将值从一个组件传递到另一个组件.
位置清单
<div uib-accordion-group class="panel-default" heading="{{location.name}}" ng-repeat="location in $ctrl.locations">
<p>This is from location list: {{location.id}}</p>
<bike-list locationId="{{location.id}}"></bike-list>
</div>
输出:
这是来自位置列表:1
位置ID是:
自行车清单
自行车list.component.js
angular
.module('bikeList')
.component('bikeList', {
templateUrl: 'bike-list/bike-list.template.html',
controller: ['$rootScope', function ($rootScope) {
var self = this;
self.bikes = $rootScope.currentBikes;
}],
bindings: {
locationId: '<'
}
});
自行车list.template.html
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<p>Location id is : {{$ctrl.locationId}}</p>
</body>
输出:
位置ID是:
题
我改<bike-list locationId="{{location.id}}"></bike-list>到
<bike-list location-id="location.id"></bike-list>
解决了我的问题！
输出：
这是从位置列表：1
位置ID为：1