Question

所以我想从下拉列表和输入文本字段中将值从FirstController发送到MainController，并将值从datepickers发送到SecondController到MainControler。我试图使用$ emit和$ on但没有成功。也许我以错误的方式从这些输入中获取值...您可以在下面找到我的代码。

主要控制器

'use strict';

angular.module('app').controller('MainController', ['$scope',
 function($scope) {
  $scope.$on('send-type-id', getObjectValues);
  $scope.$on('send-date', getDateValues);

  function getObjectValues(e, selectedObjectType, inputObjectId){
   $scope.objectType = selectedObjectType;
   $scope.objectId = inputObjectId;
   console.log($scope.objectType);
   console.log($scope.objectId);
  }

  function getDateValues(e, dateFrom, dateTo){
   $scope.startDate = dateFrom;
   $scope.endDate = dateTo;
   console.log($scope.startDate);
   console.log($scope.endDate);
  } 
 }
]);

FirstController

    angular.module('app').controller('FirstController',['$scope',
   function($scope){
    $scope.$emit('send-type-id',auditDropdown, selectId);
 }
])

FirstController视图

  <div ng-controller="SelectionController">
    <div class="well-panel">
        <div class="panel-body">
            <select class="form-control" ng-model="auditDropdown" ng-init="auditDropdown = auditDropdown || config.auditDropdown[0]"
                    ng-options="option.id as option.name for option in config.auditDropdown">
            </select>
            <input class="form-control" ng-model="selectId" type="text">

            <div ng-include="'modules/audit/views/components/audit-datepickers.client.view.html'"></div>

            <div>
                <button class="btn btn-sm btn-default" type="button">
                    {{'audit.navigation.button.generateAuditReport.btn'| translate}}
                </button>
            </div>
        </div>
</div>

选项的配置文件

 ...
 "auditDropdown": [
   {"id": "Name1", "name": "Name 1"}, 
   {"id": "Name2", "name": "Name 2"},
   {"id": "Name3", "name": "Name 3"},  
 ]
...

SecondController

 angular.module('app').controller('SecondController',['$scope',
       function($scope){
        $scope.$emit('send-date',auditDropdown, selectId);
     }
    ])

SecondController查看

<div ng-controller="SecondController">
    <section id="datepickerSection">
        <div>
            <input
                    type="date"
                    ng-model="startDate"
                    class="form-control"
                    placeholder="mm/dd/yyyy"
                    datepicker-popup
                    />
        </div>
        <div>
            <input
                    type="date"
                    ng-model="endDate"
                    class="form-control"
                    placeholder="mm/dd/yyyy"
                    datepicker-popup
                    />
        </div>
    </section>
</div>

修改

我收到的错误是在SecondController中未定义auditDropDown ....

Answer 1

您应该从auditDropDown获取$scope，否则js会查找名为auditDropDown的变量（selectId相同）：

$scope.$emit('send-type-id', $scope.auditDropdown, $scope.selectId);
$scope.$emit('send-date',$scope.auditDropdown, $scope.selectId);

使用$ emit从子控制器向父级发送值

1 个答案: