2

bootstrap-select(https://github.com/silviomoreto/bootstrap-select)を使用して、選択した要素を表示しています。ng-optionsとng-repeatで使用すると、何らかの理由で正しく表示されません。

これが私のコードです:

<ul>
    <li ng-repeat="category in categories">
        <select class="select" ng-model="status" ng-options="obj.Id as obj.Name for obj in statuses"></select>
     </li>
</ul>

これは私が持っているものです ここに画像の説明を入力してください

<div/>はselectコントロールのすぐ下には追加されないことに注意してください。

誰かが問題を解決しようとしましたか?どういうわけか、選択した要素を再初期化できますか?お知らせ下さい。ありがとうございました。

更新: ng-repeatの外に配置した場合の同じselectの外観は次のとおりです。

ここに画像の説明を入力してください

select要素が実際には表示されていないことがわかります(黄色のボックス)。代わりに、<div />がselect要素のすぐ下にレンダリングされます。これは、ユーザーがページに表示するものとまったく同じです。これは、最初の質問で<div/>と述べたときに意味したことです。

4

2 に答える 2

2

これは、 のクリック時のイベント リスナーが.dropdown-toggle存在しないためです。これはブートストラップ JavaScript パッケージの一部であるため、回避策を見つける必要があります。

angular.module('MyModule', []).directive('selectpicker', function () {
    return {
        restrict: 'CA',
        link: function (scope, elem) {
            angular.element(elem).selectpicker();
            angular.element('button.dropdown-toggle').on('click', function () {
                console.log('clicked')
            });
        }
    };
});
于 2013-08-11T01:16:10.747 に答える