ng-selected无效

时间:2016-03-08 19:57:22

标签: angularjs angularjs-select

ng-selected无效

我选择显示器的记录

enter image description here

和modal打开了该特定记录的数据,但未选择组合

enter image description here

但是当我检查html时,ng-selected是真的。

enter image description here

这是html的代码

var cached = Cache.Get<MyType>();
cached.Default = false; //some updating
var dbContext = new MyContext();
dbContext.Attach( cached );
dbContext.Entry( cached ).State = EntityState.Modified;
dbContext.SaveChanges();

这是控制器

<h1>Product</h1>

<div id="addProductModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="hModalh4Prod" >Add Product</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="control-label col-md-3">Product Name</label>
                            <input class="form-control" type="text" name="txtproductname" id="txtproductname" maxlength="200" ng-model="vm.product.productName" />
                        </div>
                        <div class="form-group">
                            <label class="control-label  col-md-3">Category Name</label>
                            <!--<input class="form-control col-md-9" type="text" name="txtcategoryname" id="txtcategoryname" maxlength="200" ng-model="vm.category.CategoryName" />-->
                            <select id="cmbcategory" name="cmbcategory" class="form-control" ng-model="vm.product.categoryId">
                                <option ng-repeat="cat in vm.Category" 
                                        ng-selected="{{cat.categoryID == vm.product.categoryId}}"
                                        value="{{cat.categoryID}}">
                                    {{cat.categoryName}}
                                    {{cat.categoryID == vm.product.categoryId}}
                                </option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label class="control-label  col-md-3">Product Price</label>
                            <input class="form-control" type="number" name="txtptoductprice" id="txtptoductprice" maxlength="200" ng-model="vm.product.productPrice" />
                        </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="vm.reset()">Close</button>
            <button type="button" id="btnSubmitProd" class="btn btn-primary" ng-disabled="!(vm.product.productName && vm.product.productPrice)" ng-click="vm.add()">Add</button>
        </div>
    </div>
</div>
</div>

<div class="row">
    <div class="col-md-12 col-md-offset-10">
        <a href="" ng-click="vm.openAddProductModal()"><span class="fa fa-plus fa-200px"></span> Add New Record</a>
    </div>
</div>


<table class="table table-responsive table-hover">
    <thead>
        <tr>
            <th>Product Name</th>
            <th>Category Name</th>
            <th>Product Price</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="prod in vm.Products">
            <td style="vertical-align:middle">{{prod.productName}}</td>
            <td style="vertical-align:middle">{{prod.category.categoryName}}</td>
            <td style="vertical-align:middle">{{prod.productPrice}}</td>
            <td>
                <input type="button" class="btn btn-sm btn-primary" ng-click="vm.edit(prod.productID)" value="Edit" />
                <input type="button" class="btn btn-sm btn-primary" ng-click="vm.delete(prod.productID)" value="Delete" />
            </td>
        </tr>
    </tbody>
</table>

<script type="text/javascript">

    $(document).ready(function () {
        console.log("In document ready");

    });

</script>

1 个答案:

答案 0 :(得分:0)

通过执行此操作

更改使用ng-option后,它可以正常工作
m<n