角度2のデータをバインドできません

Question

countriesデータを先読みのpxコンポーネントにバインドしようとしています。

コデペンリンクhere。

データをHTML形式で直接バインドする場合、先読みは国のリストを提案しています。しかし、クラスからデータを渡すことで同じものを試してみると、バインディングではありません。

var AppComponent = ng 
    .Component({ 
    selector: 'my-app' 
    }) 
    .View({ 
    template: `<div> 
<h3>Case 1 : Working dropdown:</h3> 
<px-typeahead placeholder="Enter your search query" local-candidates='["Alabama","Alaska","American Samoa","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","District Of Columbia", "South Dakota","Tennessee","Texas","Utah","Vermont","Virgin Islands","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]'></px-typeahead> 
<br> 
<h3>Case 2 : Not working dropdown if data is bind from controller:</h3> 
    <px-typeahead placeholder="Enter your search query" local-candidates={{countries}}></px-typeahead> 
{{countries}} 
    </div>` 
    }) 
    .Class({ 
    constructor: function() {  
     this.countries=["United States", "Antigua and/or Barbuda", "Argentina", "Armenia", "Aruba", "Australia", "Austria", "Azerbaijan"] 
    } 
    }); 

は、コンポーネントpx-typeaheadは、その属性local-candidates内のデータが''を持つ配列であることを期待していると考えてください。 ,"countries"などのようにバインドの方法を変えてみましたが、うまくいきませんでした。

Answer 1

CodePenで動作する正しい構文（双方向データバインディング用）は[local-candidates]="countries"です。