从父元素获取属性后，控制子元素的dom-if答案

【问题标题】：Control the dom-if of child element, after getting a property from parent element从父元素获取属性后，控制子元素的dom-if
【发布时间】：2016-09-29 01:33:01
【问题描述】：

我对聚合物很陌生，我想在下面的场景中执行...... 我有一个绑定变量 {{readonly}}，通过它我在 Polymer 中将数据从父 Dom-HTML 发送到子 Dom-HTML

sn-p的代码大致是这样的..

从父级调用子DOM，（我已经在父级中用“true”初始化了readonly）

<wms-griddata order-obj='{{item}}' readonly='{{readonly}}'></wms-griddata>

在子元素中

<dom-module id="wms-griddata">
.....
   <template is="dom-if" if="{{_isreadonly()}}">
    <callsome1></callsome1>
</template>
<template is="dom-if" if="{{!_isreadonly()}}">
    <callsome2></callsome2>
</template> 

 <script>
    Polymer({
    is : 'wms-griddata',
    properties: {
           readonly: {
                    type: String
                }
    .......
    .......
            _isreadonly: function(){
                if(this.readonly == 'true')
                   return true;
                else
                   return false;
        }

我发现在子元素中首先触发 created，然后绘制 HTML，然后本地 DOM 的所有属性都从父元素获取值。

但我希望 dom-if 仅在我从父 {{readonly}} 获取值后才被验证，以便我可以调用正确的子-child-dom [callsome1 或 callsome2]

谁能给我一个想法/技巧，我怎样才能达到要求？

提前致谢

【问题讨论】：

标签： javascript angularjs node.js polymer loopback

【解决方案1】：

而不是调用this.readOnly 我认为您应该将该变量作为参数传递给_isReadOnly 函数，如下所示：

_isreadonly: function(readOnly){
     return readOnly == 'true';
}

因此，您的 html 将如下所示：

<template is="dom-if" if="{{_isreadonly(readOnly)}}">
    <callsome1></callsome1>
</template>
<template is="dom-if" if="{{!_isreadonly(readonly)}}">
    <callsome2></callsome2>
</template>

在这种情况下，每次readonly 更改，都会调用_isreadonly 函数并更新DOM。

【讨论】：