Question

select 
    car.id as carID,
    maker.carId as makerCarId, maker.name as makerName, 
    license.carId as licenseCarId, license.plateNumber as plateNumber 
from 
    car car,
    maker maker, 
    license license  
    where car.id = 4951
;

detail.js

car.html

    <body ng-app="carService" ng-controller="selectDropdown">
        <div>
            Car Brand:
            <select ng-model="userSelect">
                <option value="">--Select--</option>
                <option ng-repeat="ManufactureBrand in a" ng-bind="ManufactureBrand" 
                </option>
            </select>
            <input type="button" value="submit" ng-click="checkselection()">
            <span color:red>{{msg}}</span>
        </div>
    </body>

嗨，我正在尝试新的angularjs，我在下拉列表中显示所选项目时遇到问题。请帮助如何从下拉框中显示所选项目。提前谢谢。

Answer 1

尝试使用ng-options：

    <body ng-app="carService" ng-controller="selectDropdown">
            <div>
                Car Brand:
                <select ng-model="userSelect" ng-options=" item as item for item in a">
                    <option value="">--Select--</option>
                </select>
                <input type="button" value="submit" ng-click="checkselection()">
                <span color:red>{{msg}}</span>
            </div>
        </body>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

        <script>
            var app=angular.module('carService',[]);

            app.factory('Brandtest',function(){
                var brand={};
                brand.sample=['Bmw','Mercedes','Honda'];
                return brand;
            });

            app.controller('selectDropdown',['$scope','Brandtest',function($scope,Brandtest){
                $scope.a=Brandtest.sample;

               $scope.checkselection= function(){
                    if($scope.userSelect !="" && $scope.userSelect !=undefined){
                    $scope.msg = $scope.userSelect;


            }
            }
            }]);
        </script>

Answer 2

使用选项

中的值

 <option ng-repeat="ManufactureBrand in a" ng-bind="ManufactureBrand" value="{{ManufactureBrand}}" ></option>

否则你是对的

Answer 3

检查此代码段，对代码进行少量更改。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="carService" ng-controller="selectDropdown">
        <div>
            Car Brand:
            <select ng-model="userSelect">
                <option value="">--Select--</option>
                <option value="{{ManufactureBrand}}" ng-repeat="ManufactureBrand in a" ng-bind="ManufactureBrand">
                </option>
            </select>
            <input type="button" value="submit" ng-click="checkselection()">
            <span style="color:red">{{msg}}</span>
        </div>
    </body>

{{1}}

使用angularjs从下拉框中显示所选项目

3 个答案: