avalon添加子元素时,碰见ms-if会将if块原样输出,求解?

前往火星中
  • 314

当点击"添加1"是,显示结果为:

{{ @el.a }}
aaa

想要得到的结果是只得到

aaa

求解!

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://unpkg.com/avalon2@2.2.8/dist/avalon.js"></script>
</head>
<body>
<div id="floor" ms-controller="floor">
    <button ms-click="add_floor(2)" >添加2</button>
    <button ms-click="add_floor(1)" >添加1</button>
    <div class="floor" ms-for="el in @items" ms-click>
        <div class="type1" ms-if="@el.type==1">
            {{ @el.a }}
        </div>
    </div>
</div>
<script>
    var floors = avalon.define({
        $id       : 'floor' ,
        items     : [],
        add_floor : function(eq){
            var obj = {
                'type': eq,
                'a'   : 'aaa'

            };
            floors.items.push(obj);
        }
    })
    floors.items.push(
        {
            'type' : '1',
            'a'    : 'aaa'
        }
    );

</script>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
<!--    <script src="avalon2.js"></script>-->
   <script src="https://unpkg.com/avalon2@2.2.8/dist/avalon.js"></script>
</head>
<body>
<div id="floor" ms-controller="floor">
    <button ms-click="add_floor(1)" >添加1</button>

//???????
    <div class="floor" ms-for="el in @items" ms-visible="el.type==1">
        <div class="type1"  ms-if="el.type==1">
            {{ el.a }}
        </div>
    </div>

    <div class="floor" ms-for="el in @items" ms-visible="el.type==1">
        <div class="type1"  ms-visible="el.type==1">
            {{ el.a }}
        </div>
    </div>

    <div class="floor" ms-for="el in @items" ms-if="el.type==1">
        <div class="type1"  ms-if="el.type==1">
            {{ el.a }}
        </div>
    </div>

    <div class="floor" ms-for="el in @items" ms-if="el.type==1">
        <div class="type1"  ms-visible="el.type==1">
            {{ el.a }}
        </div>
    </div>

</div>
<script>
    var floors = avalon.define({
        $id       : 'floor' ,
        items     : [],
        add_floor : function(eq){
            var obj = {
                'type': eq,
                'a'   : 'aaa'
            };
            floors.items.push(obj);
        }
    })
</script>
</body>
</html>
回复
阅读 3.1k
1 个回答

div class="floor"ms-click去掉即可,另外,模板里的el不需要带@

<div class="floor" ms-for="el in @items">
    <div class="type1" ms-if="@el.type==1">
        {{ el.a }}
    </div>
</div>
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏