【问题标题】:How can I bind click event to an angular2 template interpolation?如何将点击事件绑定到 angular2 模板插值?
【发布时间】:2018-07-27 20:01:24
【问题描述】:

是否可以将点击事件绑定到插值?因为当我尝试执行以下代码时,我得到以下

错误错误:未捕获(承诺):

错误:模板解析错误:

解析器错误:在 [upload({{config.fileLocation}})] 中的第 7 列预期表达式出现插值 ({{}})

这是我们插值错误的模板,

  <mat-card-actions>
      <button mat-raised-button type="button" (click)="upload({{config.fileLocation}})">Upload</button>
  </mat-card-actions>

这是需要执行的角度分量。

  upload(location = "/tmp/") {
  this.loader.open();

  const fileBrowser = this.fileInput.nativeElement;
  if (fileBrowser.files && fileBrowser.files[0]) {
    const formData: FormData = new FormData();
    formData.append('file', fileBrowser.files[0]);
    formData.append('data', JSON.stringify({
      "method": "filesystem.put",
      "params": [location + fileBrowser.files[0].name, { "mode": "493" }]
    }));

    this.http.post(this.apiEndPoint, formData).subscribe(
      (data) => {
        this.loader.close();
        this.snackBar.open("your files are uploaded", 'close', { duration: 5000 });
      },
      (error) => {
        this.loader.close();
        this.dialog.errorReport(error.status, error.statusText, error._body);

      }
    );
  };
}

【问题讨论】:

    标签: javascript angular


    【解决方案1】:

    只是

    (click)="upload(config.fileLocation)"
    

    切勿将{{}}[foo]="..."(bar)="..." 一起使用

    []() 已经将该属性标记为 Angular 绑定。 {{}} 也只允许字符串绑定(字符串化每个值),而其他允许绑定对象值。

    【讨论】:

    • 哦,这很有意义,因为 &lt;input type="file" #fileInput accept="{{config.acceptedFiles}}"&gt; 这是在同一个文件中工作的。我已经使用了您的建议,这对我有用:D
    猜你喜欢
    • 2011-09-17
    • 2016-04-04
    • 1970-01-01
    • 1970-01-01
    • 2016-12-02
    • 2017-05-17
    • 2014-09-04
    • 1970-01-01
    • 2011-05-18
    相关资源
    最近更新 更多