使用angularjs从url参数预填充文本框

时间:2015-09-28 20:12:40

标签: angularjs

我试图从网址中的参数中获取值并使用它来填充页面上的一些文本框但我无法弄明白。任何人都可以帮忙(p.s im new to angular)

这是我的示例texboxes

<div class="container">
    val1: <input type="text" ng-model="vm.txt1" />
    val2:<input type="text" ng-model="vm.txt2" />
</div>

这是我的控制器中的示例代码

(function() {
    'use strict';

     angular.module('app').controller('exampleController', ExampleController);

     ExampleController.$inject = ['$scope', '$location', '$window', '$http', '$templateCache'];       

     function ExampleController($scope, $location, $window, $http,   $templateCache) {
         var location = $location;
         var url = $scope.location.url('http://www.example.com/examplepage?name=todd&age=20');
         $scope.vm.txt1 = $scope.location.search().name;
         $scope.vm.txt2 = $scope.location.search().age;
     };
})();

2 个答案:

答案 0 :(得分:4)

你有:

   var location = $location;
   var url = $scope.location.url('http://www.example.com/examplepage?name=todd&age=20');
    $scope.vm.txt1 = $scope.location.search().name;
    $scope.vm.txt2 = $scope.location.search().age;

应该是:

  $scope.vm.txt1 = $scope.location.search().name;
  $scope.vm.txt2 = $scope.location.search().age;

您可以删除本地“var location = $ location”,因为$ location就足够了。没有必要为此实例的$ scope添加$ location。

答案 1 :(得分:2)

控制器

在控制器中,只需设置:

$scope.urlParams = $location.search();

HTML

<input type="text" ng-model="urlParams.name" />
<input type="text" ng-model="urlParams.age" />