Pertanyaan Sudut 1 - dapatkan parameter URL saat ini


Saya ingin mengekstrak data dari URL saat ini dan menggunakannya dalam pengontrol. Misalnya saya memiliki url ini:

app.dev/backend/surveys/2

Bit yang ingin saya ekstrak:

app.dev/backend/ :mengetik / : id

Apakah ada sesuatu di Angular yang dapat membantu saya dengan tugas ini?


35
2017-12-18 10:40


asal


Jawaban:


Untuk mendapatkan parameter dari URL dengan ngRoute . Itu berarti Anda harus memasukkan angular-route.js dalam aplikasi Anda sebagai ketergantungan. Informasi lebih lanjut bagaimana melakukan ini di resmi Dokumentasi ngRoute.

Solusi untuk pertanyaan:

// You need to add 'ngRoute' as a dependency in your app
angular.module('ngApp', ['ngRoute'])
    .config(function ($routeProvider, $locationProvider) {
        // configure the routing rules here
        $routeProvider.when('/backend/:type/:id', {
            controller: 'PagesCtrl'
        });

        // enable HTML5mode to disable hashbang urls
        $locationProvider.html5Mode(true);
    })
    .controller('PagesCtrl', function ($routeParams) {
        console.log($routeParams.id, $routeParams.type);
    });

Jika Anda tidak mengaktifkan $locationProvider.html5Mode(true);. Url akan menggunakan hashbang (/#/).

Informasi lebih lanjut tentang routing dapat ditemukan pada sudut resmi Dokumentasi API rute $.


Catatan sampingan: Pertanyaan ini menjawab bagaimana mencapai ini dengan menggunakan ng-Route namun saya akan merekomendasikan menggunakan ui-Router untuk routing. Lebih fleksibel, menawarkan lebih banyak fungsi, dokumentasi sangat bagus dan dianggap sebagai pustaka routing terbaik untuk sudut.


53
2018-03-28 16:15



Anda bisa menyuntikkan $routeParams ke pengontrol Anda dan mengakses semua params yang digunakan saat rute diselesaikan.

Misalnya.:

// route was: app.dev/backend/:type/:id

function MyCtrl($scope, $routeParams, $log) {
    // use the params
    $log.info($routeParams.type, $routeParams.id);
};

Lihat angular $ routeParams dokumentasi untuk informasi lebih lanjut.


14
2017-12-18 10:46



Lebih baik akan menghasilkan url seperti

app.dev/backend?type=surveys&id=2

lalu gunakan

var type=$location.search().type;
var id=$location.search().id;

dan menyuntikkan $ lokasi dalam pengontrol.


4
2018-01-30 17:16



Dalam konfigurasi rute Anda, Anda biasanya menentukan rute seperti,

.when('somewhere/:param1/:param2')

Anda kemudian bisa mendapatkan rute dalam objek menyelesaikan dengan menggunakan $route.current.params atau di controller, $routeParams. Dalam kedua kasus parameter diekstraksi menggunakan pemetaan rute, jadi param1 dapat diakses oleh $routeParams.param1 di controller.

Edit: Perhatikan juga bahwa pemetaan harus tepat

/some/folder/:param1

Hanya akan cocok dengan satu parameter.

/some/folder/:param1/:param2 

Hanya akan cocok dengan dua parameter. 

Ini adalah sedikit berbeda dari sisi server sisi yang paling dinamis. Misalnya pemetaan rute NodeJS (Express) di mana Anda hanya dapat menyediakan satu rute dengan jumlah parameter X.


3
2017-12-18 10:46



ex: url /: id

var sample= app.controller('sample', function ($scope, $routeParams) {
  $scope.init = function () {
    var qa_id = $routeParams.qa_id;
  }
});

2
2017-09-02 17:00



Cukup menyuntikkan layanan ruteParams:

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


1
2017-12-18 10:46