根据特定的选择选项 - AngularJS显示默认过滤器

时间:2017-03-07 19:19:24

标签: javascript jquery html angularjs

我有一个选择菜单。

<select id="dd" ng-show='data != null' ng-model='search'></select>

和我的其他HTML内容

<div ng-repeat="obj in data | filter:search" ng-show="search">

    <div class="row">

        <!-- Country -->
        <div class="col-xs-4 text-center" >
            <p>[[obj.country]]</p>
            <img src="data:image/png;base64,[[obj.flag]]" alt="" width="30px">
        </div>

        <!-- Main Info -->
        <div class="col-xs-4" >
            <p class="company-name">[[obj.user.username]]</p>
            <p>[[obj.obj.phone_public]]</p>
            <p>[[obj.user.email]]</p>
            <a href="[[obj.obj.url]]">[[obj.obj.url]]</a></span> <span class="col span_2_of_6">
        </div>

        <!-- Logo -->
        <div class="col-xs-4 pull-right" >
            <img src="data:image/png;base64,[[obj.logo]]" alt="" width="100px">
        </div>

    </div>

    <br><hr>


</div>

当用户更改选择菜单时,我触发了过滤器。

我正在尝试将USA设为我的默认选择。所以我在我的JS部分做了这个

$.each(unique_countries, function (index, value) {
    if(value == 'United States of America'){
        $("#dd").append($("<option value= '" + value + "' selected='selected' >").text(value));
    }else{
        $("#dd").append($("<option value= " + value + ">").text(value));
    }
});

到目前为止一切顺利,如果我更改/触摸我的选择菜单,它也能正常工作。

我的目标是显示过滤器的结果,因为我一旦登陆页面就会将选择菜单发送到美国。

到目前为止它没有这样做。你可以在这里看到我的内容:JSFiddle

结果现在:

enter image description here

结果我希望它是:

enter image description here

有关此的任何提示吗?

1 个答案:

答案 0 :(得分:1)

而不是在html循环中添加所选属性

添加

$scope.search = 'United States of America';

并用

替换html循环
$.each(unique_countries, function (index, value) {
    $("#dd").append($("<option value= " + value + ">").text(value));
});

工作解决方案 - https://jsfiddle.net/0xj47wax/1/