Question

我正在尝试创建一个如下工作的表单：

主视图包含所有字段的列表例如1.商人，2。金额3.日期

表格相当长。我不希望做多步形式，而是希望做到以下几点：

点击商家以打开选择商家视图，然后选择商家将值返回主视图。
点击金额以输入金额视图。输入值后，将值返回主视图
点击日期进入日期视图。选择日期后，将int返回主视图。

任何提示？

Answer 1

您可以使用服务在与每个视图关联的控制器之间共享数据。

app.service('YourService', function($q) {
  return {
    details: 
      {
        name: 'Merchant_1',         //Some default values
        amount: 100,
        date: ""
      }
    ,
    getDetails: function() {
      return this.details
    },
    setDetails: function(name,amount,date) {
      this.details.name = name;
      this.details.amount = amount;
      this.details.date = date;
    },
    setName: function(name){
      this.details.name = name;
    }
  }
});

并在您的控制器中注入'YourService'。例如。商家视图的控制器。

app.controller( 'MerchantViewCtrl', function( $scope, YourService ) {
      var onSelect = function(MerchantName){
           YourService.setName(MerchantName); 
      }
});

选择商家视图

 <select ng-click="onSelect(merchant.name)" ng-options="merchant in merchantsList">
 </select>

并在主视图控制器中

app.controller( 'MainViewCtrl', function( $scope, YourService ) {
      var details = YourService.getDetails();
      $scope.name = details.name;
      $scope.amount = details.amount;
      $scope.date = details.date;
});

离子返回值到上一个视图

1 个答案: