解释正确的语法使用材料膨胀面板从镖角2材料

Question

设定栏我使用该存储库：https://github.com/dart-lang/angular2_components

下面的代码块是从app_component.html。我在材料展开面板中添加了asignment：disableHeaderExpansion。一切正常，因为我用括号括住了disableHeaderExpansion。

<material-expansionpanel name="Expansion panel" [disableHeaderExpansion]="true"> 
    <div> 
     Oh hi. I was just trying not to take too much space here. 
    </div> 
    </material-expansionpanel> 

当我删除括号disableHeaderExpansion周围，组件不正确显示。我在角2个组件看了看MaterialExpansionPanel：

/// If true, clicking on the header does not expand or collapse the panel. 
    @Input() 
    bool disableHeaderExpansion = false; 

    /// A short name label for the expansion panel. 
    @Input() 
    String name; 

当我把支架上的名称字段，该组件不出现为好。

为什么我需要在disableHeaderExpansion中放置括号，但是我不应该在名称字段中放置括号？我希望我需要在名称字段中加上括号。

输入这个问题后，我意识到这可能是答案。

这是一个例外，因为Html已经有一个名称属性？

Answer 1

按documentation，我们应该省略括号当所有下列条件都为真：

• target属性接受一个字符串值。
• 该字符串是一个固定值，我们可以将它烘焙到模板中。
• 这个初始值从来没有 的变化。

因为它，你可以省略你的name字段的括号。

括号告诉Angular评估模板表达式。如果我们忘记括号，Angular会将该字符串视为常量，并使用该字符串初始化目标属性。因此，当你从disableHeaderExpansion字段中删除方括号时，Angular会将其视为字符串，但您已声明它为bool和@Input，这会使组件属性初始化错误，并且因为它的组件不能正确显示。