2

这之间是否有任何组合： https : //www.polymer-project.org/components/paper-elements/demo.html#paper-dropdown-menu 和 angularjs。

我试过但仍然无法让它工作..

        <paper-dropdown-menu label="Categories">
            <paper-dropdown class="dropdown">
                <core-menu class="menu">
                    <template>
                        <paper-item ng-repeat="c in categories">{{c}}</paper-item>
                    </template>
                </core-menu>
            </paper-dropdown>
        </paper-dropdown-menu>

任何建议将不胜感激 ！

4

1 回答 1

1

这就是我使用ng-polymer-elements 的方式。

我首先为 . 创建了一个映射core-menu，这将允许您在选择项目时使用 ng-model 并在您的范围内调用方法。

    coreMenu: {
       ngModel: {
           primitive: "selected"
       },
       ngTap: {
           event: "core-activate"
       }
    }

HTML

    <paper-dropdown-menu label="My Items">
        <paper-dropdown class="dropdown">
            <core-menu class="menu" ng-model="my.item">

                <paper-item ng-repeat="item in items" name="{{item.name}}">
                    {{item.name}}
                </paper-item>

            </core-menu>
        </paper-dropdown>
    </paper-dropdown-menu>

注意name纸张项目中的属性。这非常重要，因为核心菜单使用它来跟踪所选项目。valueattr="foo"您可以通过在核心菜单上进行设置来使用不同的属性名称。

如果您需要更多详细信息或功能，可以添加ng-tap="myFunction($event)"到 core-menu 元素以在您的范围内调用方法。然后，您可以从事件详细信息中获取有关所选项目的信息。

scope.myFunction = function($event) {
  var details = $event.detail.item.attributes.foo.value;
}
于 2014-12-01T08:14:00.693 回答