“Angular 2 无法理解 View#template 中的值"；使用 $event [英] "Angular 2 could not understand the value in View#template" using $event

问题描述

我无法让 $event 工作.示例:

I can't get $event working. Example:

import 'package:angular2/core.dart';

@Component(
    selector: 'my-app', 
    template: '''
        <h1>{{title}}</h1>
        <button (click)="onTest($event)">testing</button>
    ''')
class AppComponent {
    String title = 'Testing event';

    onTest(event) {
        print(event);
    }
}

当我让 pub 服务应用程序时，我抛出一个构建错误:

When I let pub serve the app, I throws a build error:

Build error:
Transform DirectiveProcessor on file_transfer|lib/app_component.dart threw error: Angular 2 could not understand the value in View#template.
'''
        <h1>{{title}}</h1>
        <button (click)="onTest($event)">testing</button...
package:angular2/src/transform/common/type_metadata_reader.dart 164:5   _expressionToString
package:angular2/src/transform/common/type_metadata_reader.dart 920:17  _CompileTemplateMetadataVisitor._populateTemplate
package:angular2/src/transform/common/type_metadata_reader.dart 901:9   _CompileTemplateMetadataVisitor.visitNamedExpression
package:analyzer/src/dart/ast/ast.dart 7455:15                          NamedExpressionImpl.accept
...

我还尝试将 (click) 更改为 ng-click，如下所示 AngularDart 1.0 中的 $event 不再可用 - 有什么替代方法? 但它没有帮助.

I also tried to change the (click) into ng-click as here $event in AngularDart 1.0 is not available anymore - what is the alternative? but it didn't help.

我是 angular 的新手，但是上面的代码应该可以工作，对吧?我看了 https://webdev.dartlang.org/angular/guide/template-syntax#!#event-binding 和使用 $event 的英雄示例.看不出有什么区别...

I'm new to angular, but the code above should work, right? I looked at https://webdev.dartlang.org/angular/guide/template-syntax#!#event-binding and the heroes example where $event is used too. Can't see any difference...

感谢任何帮助.

推荐答案

如果模板在其自己的文件中，此代码段将正常工作.

This snippet would work fine if the template was in its own file.

但是，由于模板在 .dart 文件中，字符串中的任何 $variable 都将计算为 variable 的值在这种情况下.

However, since the template is in a .dart file, any $variable in a string will be evaluated to the value of variable in that context.

在这种情况下，以下任一方法都可以实现:

In this case, either of the following will make this work:

1. 转义模板中的 $.替换

测试

与

测试

1. 使用原始字符串作为模板:

模板:r'''...模板内容...''')

这篇关于“Angular 2 无法理解 View#template 中的值"；使用 $event的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！