Question

使用angularJS我试图找出一种方法来绑定控制器A范围内的select元素的值，以将其用作ng-click调用[getQuizByCampID（）函数]的参数。控制器B.

我的第一个想法是使用jquery，但我在下面的链接中读到，当使用angularJS开始时不建议使用jquery。

"Thinking in AngularJS" if I have a jQuery background?

我还在下面的链接中读到这是使用ng-model执行的，唯一的问题是所提供的示例都在同一个控制器下。和Binding value to input in Angular JS

将控制器A下的select元素的值输入到控制器B下的select中的函数调用的angularJS方法是什么？

Price.html视图

  <div class="col-sm-3" ng-controller="campCtrl"> **Controller A** 
       <select  id="selCampID" class="form-control" ng-model="campInput" >
            <option ng-repeat="camp in campaigns" value="{{camp.camp_id}}">{{camp.camp_name}}</option>  
        </select>
  </div>

   <div class="col-sm-3" ng-controller="quizCtrl">  **Controller B**
        <select   ng-click="getQuizByCampID($('#selCampID').val())" class="form-control" ng-model="quizInput">
             <option ng-controller="quizCtrl" ng-repeat="quiz in quizzesById" value="{{quiz.quiz_id}}">{{quiz.quiz_name}}</option>  
         </select>
    </div>

App.js

var app= angular.module('myApp', ['ngRoute']);
app.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/price', {templateUrl: 'partials/price.html', controller: 'priceCtrl'});
}]);

$routeProvider.when('/price', {templateUrl: 'partials/price.html', controller: 'priceCtrl'});

测验控制器

'use strict';

app.controller('quizCtrl', ['$scope','$http','loginService', function($scope,$http,loginService){
$scope.txt='Quiz';
$scope.logout=function(){
    loginService.logout();
}
getQuiz(); // Load all available campaigns 
function getQuiz(campID){  
    $http.post("js/ajax/getQuiz.php").success(function(data){
    $scope.quizzes = data;
    //console.log(data);
   });
};
  $scope.getQuizByCampID = function (campid) {
  alert(campid);
$http.post("js/ajax/getQuiz.php?campid="+campid).success(function(data){
    $scope.quizzesById = data;
    $scope.QuizInput = "";
  });
  };

    $scope.addQuiz = function (quizid, quizname, campid) { 
  console.log(quizid + quizname + campid);   
  $http.post("js/ajax/addQuiz.php?quizid="+quizid+"&quizname="+quizname+"&campid="+campid).success(function(data){

  getQuiz();
  $scope.QuizInput = "";
});
  };

}])

Answer 1

您应该将值存储在服务中。

示例：

app.factory('SharedService', function() {
  this.inputValue = null;

  this.setInputValue = function(value) {
    this.inputValue = value;
  }

  this.getInputValue = function() {
    return this.inputValue;
  }

  return this;
});

Example on Plunkr

阅读：AngularJS Docs on services

或查看此Egghead.io video

Answer 2

您应该使用服务来存储值。

这是怎么做的： Share data between AngularJS controllers

绑定值以在两个控制器中选择角度js

Price.html视图

App.js

测验控制器

2 个答案: