角度コンポーネントのboundプロパティの値を設定できません

Question

component documentationとthis exampleで説明されているように、角度コンポーネントの境界プロパティを実装しようとしています。

残念ながら、タグレベルまたは$onInitメソッドで割り当てられている値は使用されません。それをモデル値として使用したときにも値は印刷されません。

full code on plunkerがあります。

マイバインディング定義：

(function(angular) { 
    'use strict'; 

    function SearchResultController($scope, $element, $attrs) { 
    var ctrl = this; 
    ctrl.searchFor = 'nohting-ctor'; 

    ctrl.$onInit = function() { 
     console.log('SearchResultController.$onInit: searchFor='+ctrl.searchFor); 
     ctrl.searchFor = 'nothing-int'; 
    }; 

    } 

    angular.module('myApp').component('searchResult', { 
    templateUrl: 'searchResult.html', 
    controller: SearchResultController, 
    bindings: { 
     searchFor: '<' 
    } 
    }); 
})(window.angular); 

テンプレート：

<p>SearchResult for <span ng-model="$ctrl.searchFor"</span></span></p> 

それが使われている方法：nothing-*値の

<h1>Main Window</h1> 
<search-input on-start-search="$ctrl.startSearch(value)"></search-input> 
<search-result search-for="nothing-ext"></search-result> 

どれも示さエバースではありません。

何か問題がありますか？

Answer 1

あなたのコンポーネントの使用方法が正しくありません。あなたはそれが引用されなければならない文字列を渡したい場合は、次の

<search-result search-for="'nothing-ext'"></search-result> 

その後、次の問題がngModelディレクティブは、入力コントロールのためにのみ有効であるとして、このライン

<p>SearchResult for <span ng-model="$ctrl.searchFor"</span></span></p> 

は、意味がないということです。あなたはngBindまたは簡単にしたい{{ $ctrl.searchFor }}：

<p>SearchResult for <span ng-bind="$ctrl.searchFor"</span></span></p>