将参数传递给AngularJS控制器方法

时间:2014-10-03 03:24:16

标签: javascript angularjs dependency-injection

这可能是一个非常基本的问题,但我找不到答案。我刚开始学习AngularJs,我正在尝试用控制器做一个简单的页面,你可以在输入中输入文本并发出HTTP GET请求。到目前为止,我有以下内容:

在HTML

<body ng-app="starter" ng-controller="searchController as searchController">

<ion-pane>
  <ion-header-bar class="bar-stable">
    <h1 class="title">Ionic Blank Starter</h1>
  </ion-header-bar>
  <ion-content>
    <input type="text" ng-model="searchController.searchString" required />
    <button class="btn" ng-click="searchController.search()">Search</button>
  </ion-content>
</ion-pane>

在控制器中

angular.module('starter', [])
  .controller('searchController', function() {
    this.searchURL = 'http://www.myapifilms.com/imdb?title=%thetitle%&format=JSON';
    this.searchString = '';

    this.search = function searchMovie() {
        url = this.searchURL.replace('%thetitle%', this.searchString);
        console.log("URL: " + url);
        this.searchRequest($http, url);
    };

    this.searchRequest = function ($http, url) {
        $http.get(url).success(function(data) {
            console.log("Success: " + data);
        })
    };
});

this.searchRequest($http, url);显然是错误的,因为我没有引用$ http,稍后将由AngularJs注入。

所以我的问题是如何将$ http等AngularJs服务与我自己传递的参数混合使用?也许我没有正确地构建这个,并且很想听到有关这方面的评论。我的目标只是获取输入文本并使用它发出HTTP请求。

1 个答案:

答案 0 :(得分:2)

您应该在控制器声明中注入服务(角度或您的自定义服务),而不是在方法

中传递它
angular.module('starter', [])
    .controller('searchController', ["$http", function($http) {
        ...
    }]);