0
htmlコードでコンポーネントを設定したい状況があります。私は次の構造を持っています。 game_idとして動作するようには思え正しく表示さgame.jsを、対応するゲーム7999コントローラからコンポーネントにデータを送信できません
<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<base href="/">
<title>Providence</title>
<script src="/js/angular.js"></script>
<script src="/data-access/data-access.module.js"></script>
<script src="/data-access/data-access.service.js"></script>
<script src="/score-info/score-info.module.js"></script>
<script src="/score-info/score-info.component.js"></script>
<script src="/js/game.js"></script>
</head>
<body>
<div ng-controller="myController">
<p> {{ game_id }} </p>
<score-info game_id="{{ game_id }}"></score-info>
</div>
</body>
用ページを表示するべきexample.com/game/7999のようなURLにとして提供しています
game.html。
angular.module('myApp', [
'dataAccess',
'scoreInfo' ],
function($locationProvider){
$locationProvider.html5Mode(true);
});
angular.
module('myApp').
controller('myController', function($scope, $location) {
var split_res = $location.path().split('/');
var game_id = split_res[split_res.length-1];
$scope.game_id = game_id
});
私の問題は、私がgame_idを注入できないコンポーネントにあります。ここにscore-info.component.jsがあり、game_idは表示されません。
angular.
module('scoreInfo').
component('scoreInfo', {
templateUrl : '/score-info/score-info.template.html',
controller : function ScoreInfoController(dataAccess) {
self = this;
console.log(self.game_id) // self.game_id == undefined
dataAccess.game(self.game_id).then(function(game) {
self.game = game;
});
},
bindings : {
game_id : '<'
}
});
以前の回答では、コントローラーとコンポーネントを配線する別のサービスを使用することをお勧めしていました。 1ページにさまざまな数のscoreInfoブロックを含める必要があるので、それは私のためには機能しません。
使用 'gameIdなる： '<' '、及び使用' <スコア情報Game-ID = "{{game_id}}"> '。命名規則を尊重することは非常に重要です。 –
命名規則を修正しても機能しません。それは問題ではないようです。 – Jari
問題の少なくとも一部です。問題を再現した単純なプランを投稿してください。 –