无法以角度2绑定数据

时间:2017-09-15 09:19:56

标签: javascript html angular angular2-template

我试图将countries数据绑定到我的px组件中,这是一种预先输入。

Codepen链接here

在html中直接绑定数据时,typeahead建议列出国家/地区。但是当我通过从类传递数据而不是绑定来尝试相同的时候。

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 {{countries}}"countries"之类的CPU绑定的不同方法。但是没有用。

1 个答案:

答案 0 :(得分:1)

正确的语法(对于双向数据绑定)是[local-candidates]="countries",它可以在CodePen中使用。