Cara mendapatkan parameter url menggunakan AngularJS

Kode sumber HTML

<div ng-app="">
    <div ng-controller="test">
      <div ng-address-bar browser="html5"></div>
      <br><br>
      $location.url() = {{$location.url()}}<br>
      $location.search() = {{$location.search('keyword')}}<br>
      $location.hash() = {{$location.hash()}}<br>     
      keyword valus is={{loc}} and ={{loc1}}
  </div>
</div>

Kode sumber AngularJS

<script>
function test($scope, $location) {
  $scope.$location = $location;
  $scope.ur = $scope.$location.url('www.html.com/x.html?keyword=test#/x/u');
  $scope.loc1 = $scope.$location.search().keyword ;    
    if($location.url().indexOf('keyword') > -1){    
        $scope.loc= $location.url().split('=')[1];
        $scope.loc = $scope.loc.split("#")[0]        
    }
  }
 </script>

Di sini variabel locdan loc1keduanya mengembalikan tes sebagai hasil untuk URL di atas. Apakah ini cara yang benar?

Saya tahu ini adalah pertanyaan lama, tetapi saya perlu waktu untuk menyelesaikannya mengingat dokumentasi Angular yang jarang. The RouteProvider dan routeParams adalah cara untuk pergi. Rute menghubungkan URL ke Controller / View Anda dan routeParams dapat diteruskan ke controller.

Lihatlah proyek benih Angular . Di dalam app.js Anda akan menemukan contoh untuk penyedia rute. Untuk menggunakan params cukup tambahkan mereka seperti ini:

$routeProvider.when('/view1/:param1/:param2', {
    templateUrl: 'partials/partial1.html',    
    controller: 'MyCtrl1'
});

Kemudian di controller Anda menyuntikkan $ routeParams:

.controller('MyCtrl1', ['$scope','$routeParams', function($scope, $routeParams) {
  var param1 = $routeParams.param1;
  var param2 = $routeParams.param2;
  ...
}]);

Dengan pendekatan ini Anda dapat menggunakan params dengan url seperti: " http://www.example.com/view1/param1/param2 "

Meskipun perutean memang merupakan solusi yang baik untuk penguraian URL tingkat aplikasi, Anda mungkin ingin menggunakan layanan yang lebih rendah $location, seperti yang disuntikkan di layanan atau pengontrol Anda sendiri:

var paramValue = $location.search().myParam; 

Sintaks sederhana ini akan berfungsi untuk http://example.com/path?myParam=paramValue. Namun, hanya jika Anda mengonfigurasi $locationProviderdalam mode HTML 5 sebelumnya:

$locationProvider.html5Mode(true);

Kalau tidak, lihat di http://example.com/#!/path?myParam=someValue sintaks "Hashbang" yang sedikit lebih rumit, tetapi manfaatkan bekerja pada browser lama (tidak kompatibel dengan HTML 5) sebagai baik.

Jika Anda menggunakan ngRoute, Anda dapat menyuntikkan $routeParamske controller Anda

http://docs.angularjs.org/api/ngRoute/service/$routeParams

Jika Anda menggunakan angular-ui-router, Anda bisa menyuntikkan $stateParams

https://github.com/angular-ui/ui-router/wiki/URL-Routing

Saya menemukan solusi cara menggunakan $ location.search () untuk mendapatkan parameter dari URL

pertama di URL Anda harus meletakkan sintaks "#" sebelum parameter seperti contoh ini

"http://www.example.com/page#?key=value"

dan kemudian di controller Anda, masukkan $ location dalam fungsi dan gunakan $ location.search () untuk mendapatkan parameter URL

.controller('yourController', ['$scope', function($scope, $location) {

     var param1 = $location.search().param1; //Get parameter from URL

}]);

Jika jawaban yang sudah diposting tidak membantu, Anda dapat mencoba $ location.search (). MyParam; dengan URL http: //example.domain#? myParam = paramValue

function GetURLParameter(parameter) {
        var url;
        var search;
        var parsed;
        var count;
        var loop;
        var searchPhrase;
        url = window.location.href;
        search = url.indexOf("?");
        if (search < 0) {
            return "";
        }
        searchPhrase = parameter + "=";
        parsed = url.substr(search+1).split("&");
        count = parsed.length;
        for(loop=0;loop<count;loop++) {
            if (parsed[loop].substr(0,searchPhrase.length)==searchPhrase) {
                return decodeURI(parsed[loop].substr(searchPhrase.length));
            }
        }
        return "";
    }

Cara sederhana dan mudah untuk mendapatkan nilai url

First add # to url (e:g -  test.html#key=value)

url in browser (https://stackover.....king-angularjs-1-5#?brand=stackoverflow)

var url = window.location.href 

(output: url = "https://stackover.....king-angularjs-1-5#?brand=stackoverflow")

url.split('=').pop()
output "stackoverflow"

Saat menggunakan angularjs dengan express

Pada contoh saya, saya menggunakan angularjs dengan express melakukan routing sehingga menggunakan $ routeParams akan mengacaukan routing saya. Saya menggunakan kode berikut untuk mendapatkan apa yang saya harapkan:

const getParameters = (temp, path) => {
  const parameters = {};
  const tempParts = temp.split('/');
  const pathParts = path.split('/');
  for (let i = 0; i < tempParts.length; i++) {
    const element = tempParts[i];
    if(element.startsWith(':')) {
      const key = element.substring(1,element.length);
      parameters[key] = pathParts[i];
    }
  }
  return parameters;
};

Ini menerima templat URL dan jalur dari lokasi yang diberikan. Saya hanya menyebutnya dengan:

const params = getParameters('/:table/:id/visit/:place_id/on/:interval/something', $location.path()); 

Menyatukan semuanya controller saya adalah:

.controller('TestController', ['$scope', function($scope, $window) {
  const getParameters = (temp, path) => {
    const parameters = {};
    const tempParts = temp.split('/');
    const pathParts = path.split('/');
    for (let i = 0; i < tempParts.length; i++) {
      const element = tempParts[i];
      if(element.startsWith(':')) {
        const key = element.substring(1,element.length);
        parameters[key] = pathParts[i];
      }
    }
    return parameters;
  };

const params = getParameters('/:table/:id/visit/:place_id/on/:interval/something', $window.location.pathname);
}]);

Hasilnya adalah:

{ table: "users", id: "1", place_id: "43", interval: "week" }

Semoga ini bisa membantu seseorang di luar sana!