理解离子选择

时间:2016-10-03 06:54:44

标签: html angularjs ionic-framework

我试图使用离子列表来显示一组汽车,当选择特定的汽车时,它应该显示一个小的描述并且也可以编辑。这里我无法显示所选项目的描述。另外,请告诉我如何编辑说明并进行更新。

link here

这是控制器

car.controller('popSelect', ['$scope','$ionicPopup', function ($scope, $ionicPopup) {
   $scope.homePage = function () {
    window.location = "#/menu.html"
  }

  $scope.carList = [{ value: "Honda", description: "Its honda" },
    { value: "Toyota", description: "Its Toyota" },
    { value: "BMW", description: "Its BMW" }];
  //$scope.carList=['Bmw','Mercedes','Honda'];
  $scope.select_item = function (key) {
    {{item.decription}}
  }
}]);

1 个答案:

答案 0 :(得分:0)

Index.html的变化

<body ng-app="myApp" ng-controller="myCtrl">
   <h4>Select car</h4>
    <ion-list>
      <ion-item ng-click="select_item(value)" ng-repeat="(key,value) in carList"> 

      {{value.value}} 

      </ion-item>
    </ion-list><hr>
          <div style="text-align:center">
    <button class="button3" ng-click="showPopup()">ADD</button><hr>
    <button  class="button2" ng-click="homePage()">Back</button>
    <button class=" button2" ng-click="deleteSelected()">Delete</button>
        </div>
        <div>{{description}}</div>
     <!--{{couponTitle}} {{couponDescribe}} {{validFrom}} {{validTo}} -->
  </body>

在你的js中

var car=angular.module('myApp',[]);
car.controller('myCtrl', ['$scope', function ($scope) {
   $scope.homePage = function () {
    window.location = "#/menu.html"
  }
 // $scope.description = '';
  $scope.selectedItem = 'select';
  $scope.items=[];
  $scope.carList = [{ value: "Honda", description: "Its honda" },
    { value: "Toyota", description: "Its Toyota" },
    { value: "BMW", description: "Its BMW" }];
  //$scope.carList=['Bmw','Mercedes','Honda'];
  $scope.select_item = function (key) {
    $scope.description=key.description;
  }
}]);

谢谢(Y)