参数传递Angular JS

时间:2015-07-18 11:01:35

标签: javascript angularjs

我是Angular的新手,而且坦率地说是Java Script。我从一些示例和教程中构建了一个原型应用程序,并且遇到了一个可以通过传递参数来解决的简单问题。

我想在我的控制器(myKey)中接收一个参数并将其传递给工厂,然后工厂将其传递给Web API。我可以在工厂中为myKey定义一个常量,并且一切正常,我在传递参数时遇到了问题。

抱歉新手问题,是的,我还有更多的学习要做。

由于

'use strict';

/* Factories */

angular.module("myApp.myViewer.factories", []).factory('myThings', ['$resource',
      function ($resource) {
          var resource = $resource('/api/myThings', {}, { get: { method: 'GET', params: { myKey:"M1234" } } });

        return resource;
    }
]);


/* Controllers */

angular.module("myApp.myViewer.controllers", [])
   .controller('myCtrl', ['$scope', 'myThings', function ($scope, myThings) {

      myThings.get(function (response) {
          console.log(response);
          $scope.myThing = response;
      });
  }]);

1 个答案:

答案 0 :(得分:2)

你有两个独立的模块,彼此一无所知。你必须添加一个模块作为另一个模块的依赖,所以像这样:

angular.module("myApp.myViewer.controllers", ["myApp.myViewer.factories"])

但我认为在这种情况下会使事情变得复杂,我认为你最好将这两个模块结合起来:

您还需要添加ngResource作为依赖项,并确保将其加载到您的网页上,因为Angular没有这样做。

angular
  .module("myApp", ['ngResource'])
  .factory('myThings', ['$resource', function ($resource) {

        return {

          // define a function that returns your $resource after
          // passing in the 'myKey' parameter
          resource: function(myKey){
            return $resource('/api/myThings', {}, { 
              get: { 
                method: 'GET', 
                params: { myKey: myKey }
              } 
            });
          }

        };

      }

  ])
  .controller('myCtrl', ['$scope', 'myThings', function ($scope, myThings) {

      // inject the myThings service and call the resource function
      // that we defined to create your resource object.
      var Keys = myThings.resource(myKey)

      // make a get request on your resource and
      // assign the response value to a $scope variable
      // so any properties on your response object can be displayed in 
      // your view template
      Keys.get(function (response) {
          console.log(response);
          $scope.myThing = response;
      });
  }]);