javascript - 无法以 Angular 2 绑定(bind)数据

标签 javascript html angular angular2-template

我正在尝试将 countries 数据绑定(bind)到我的 px 组件中,这是一个 typeahead。

Codepen 链接 here .

在 html 中直接绑定(bind)数据时,预先输入会提示国家列表。但是,当我尝试通过从类传递数据时,它没有绑定(bind)。

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 中的数据是一个带有 '' 的数组。 我尝试了不同的绑定(bind) countries 的方法,例如 {{countries}}"countries" 等。但是没有用。

最佳答案

正确的语法(对于双向数据绑定(bind))是[local-candidates]="countries",这将适用于您的CodePen .

关于javascript - 无法以 Angular 2 绑定(bind)数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46236089/

相关文章:

javascript - Windows 机器上的 Rails 和 JavaScript 运行时问题

node.js - 如何在 Angular Web Worker 中导入 Node 模块?

angular - 如何验证空格/空格? [ Angular 2]

javascript - 获取父元素属性值

javascript - 使用 underscore.js 查找基于双重属性的唯一值

javascript - 使用 Javascript 即时更改图像 src

php - 基于 PHP 和 jQuery 构建的倒数计时器?

html - 为什么人们会选择可编辑的 DIV 而不是 INPUT 或 TEXTAREA

angular - 如何将我的 Angular 应用程序与 Azure Active Directory 绑定(bind)?

javascript - 页面刷新后保持最后一个复选框处于选中状态