AngularJS ব্যবহার করে ইউআরএল প্যারামিটারগুলি কীভাবে পাবেন

Question

এইচটিএমএল উত্স কোড

<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>

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>

উপরের URL টির ফলাফল হিসাবে এখানে ভেরিয়েবল locএবং loc1উভয়ই পরীক্ষার পরীক্ষা দেয় return এটি কি সঠিক উপায়?

Comments

আপনি $ রুটপ্যারামগুলি পরীক্ষা করে দেখতে চাইতে পারেন ।

— নিক হেইনার

আপনি এখানে কী জিজ্ঞাসা করছেন তা পরিষ্কার নয় ... $ রুটপ্যারামগুলি এবং $ অবস্থান # পদ্ধতির ডকসগুলি আপনাকে শুরু করা উচিত

— ডেক

ভোট দেওয়ার সময় একটি মন্তব্য যুক্ত করার বিষয়টি বিবেচনা করুন যাতে প্রশ্নের উন্নতি করা যায়। ধন্যবাদ।

— praveenpds

Answer 1

আমি জানি এটি একটি পুরানো প্রশ্ন, তবে বিরল কৌণিক ডকুমেন্টেশনের কারণে এটি সমাধান করতে আমার কিছুটা সময় লেগেছিল। RouteProvider এবং routeParams যেতে উপায়। রুটটি আপনার কন্ট্রোলার / ভিউতে ইউআরএলকে ওয়্যার আপ করে এবং রুটপ্যারামগুলি নিয়ামকটিতে যেতে পারে।

পরীক্ষা করে দেখুন কৌণিক বীজ প্রকল্প। অ্যাপ্লিকেশনগুলির মধ্যে আপনি রুট সরবরাহকারীর জন্য একটি উদাহরণ পাবেন। প্যারামগুলি সহজেই এগুলি যুক্ত করুন:

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

তারপরে আপনার নিয়ামক ইনজেক্ট $ রুটপ্যারামগুলিতে:

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

এই পদ্ধতির সাহায্যে আপনি url এর সাথে প্যারাম ব্যবহার করতে পারেন যেমন: " http://www.example.com/view1/param1/param2 "

Comments

নোট করুন যে এই উদাহরণের শেষ লাইনটি });হওয়া উচিত}]);

— অ্যান্ড্রু ল্যাঙ্ক

এছাড়াও কোয়েরি স্ট্রিং আকারে অন্যান্য নির্বিচারে প্যারাম পেতে পারেন /view/1/2?other=12সঙ্গে $routeParams.other

— DavidC

আমি মনে করি আপনার নিয়ামকটিতে আপনার 'বার প্যারাম 1' পুনরাবৃত্তি হয়েছে। এত সাধারণ পরিবর্তন আমি সম্পাদনা করতে পারিনি।

— টম

কৌনিকটি এটিকে এত সহজ করে তোলে এবং আপনার

— উত্তরটিও

নির্ধারণ করুন এবং প্রেরণ করুন: var param1 = "abc"; $ অবস্থান.পাথ ('/ ভিউ 1 /:' + প্যারাম 1);। রুট.রেলোড ();

— রোবট 70

Answer 2

যদিও অ্যাপ্লিকেশন-স্তরের ইউআরএল পার্সিংয়ের জন্য রাউটিংটি সত্যই ভাল সমাধান, আপনি $locationনিজের পরিষেবাতে বা নিয়ামকটিতে ইনজেকশনের মতো আপনি আরও নিম্ন-স্তরের পরিষেবাটি ব্যবহার করতে চাইতে পারেন :

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

এই সাধারণ বাক্য গঠনটি কাজ করবে http://example.com/path?myParam=paramValue। তবে, আপনি যদি $locationProviderআগে এইচটিএমএল 5 মোডে কনফিগার করেন তবে:

$locationProvider.html5Mode(true);

অন্যথায় http://example.com/#!/path?myParam=someValue "হাশবাং" সিনট্যাক্সটি দেখুন যা কিছুটা জটিল, তবে পুরানো ব্রাউজারগুলিতে (এইচটিএমএল 5 নন সামঞ্জস্যপূর্ণ) কাজ করার সুবিধা রয়েছে আমরা হব.

Comments

দেখে মনে হচ্ছে আপনাকে মডিউল কনফিগারেশনের মতো ang লোকেশনপ্রাইডার এইচটিএমএল 5 মড (সত্য) যোগ করতে হবে: কৌণিক.মোডুল ("মাই অ্যাপ", [])। تشکیل

— sq1020

এবং এইচটিএমএল 5 মডেলের <base href="http://example.com/en/" />আপনার একটি ট্যাগ দরকার index.html।

— cespon

আপনার সমাধান সম্পর্কে আমি যা পছন্দ করি তা হ'ল আপনি এমনকি বস্তুগুলিও পাস করতে পারেন এবং আপনি সেগুলি অবজেক্ট হিসাবে পান।

— শিলান

<বেস> ট্যাগটি যুক্ত না করা এবং এটি এটি নির্দিষ্ট করে .config(['$locationProvider', function($locationProvider) { $locationProvider.html5Mode({ enabled: true, requireBase: false }); }])

— গিলিয়াম

কৌণিক 1.5.8 তে, $locationProviderএটি কাজ করার জন্য আমাকে কনফিগার করতে হয়নি । http://example.com/path#?someKey=someVal, তারপরে $location.search().someKey // => 'someVal'

— jiminikiz

Answer 3

আপনি ngRoute ব্যবহার করেন, তাহলে আপনি উদ্বুদ্ধ করতে পারেন $routeParamsআপনার নিয়ামক মধ্যে

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

আপনি যদি কৌণিক-ইউআই-রাউটার ব্যবহার করছেন তবে আপনি ইনজেক্ট করতে পারেন $stateParams

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

Comments

$stateParamsকোয়েরি প্যারামিটারগুলি দেখানোর জন্য , গিথুব

— angular-

Answer 4

ইউআরএল থেকে প্যারামিটার পেতে কীভাবে $ লোকেশন.সার্চ () ব্যবহার করতে হবে তার সমাধান পেয়েছি

ইউআরএল প্রথমে আপনার উদাহরণের মতো প্যারামিটারের আগে সিনট্যাক্স "#" লাগাতে হবে

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

এবং তারপরে আপনার কন্ট্রোলারে আপনি function অবস্থানটি ফাংশনে রেখেছেন এবং ইউআরএল প্যারামিটার পেতে $ লোকেশন.সন্ধান () ব্যবহার করুন

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

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

}]);

Comments

এটি ক্যোয়ারি প্যারামিটারগুলির জন্য কাজ করে এবং @ জেফের নীচের উত্তরটি পাথের ভেরিয়েবলগুলির জন্য

— আবদালি চন্দনওয়ালা

Answer 5

ইতিমধ্যে পোস্ট করা উত্তরগুলি যদি সহায়তা না করে তবে কেউ। লোকেশন.সার্চ () মাইপরাম দিয়ে চেষ্টা করতে পারে; ইউআরএল সহ http: //example.domain#? myParam = paramValue

Comments

যে দ্বিতীয় সর্বোচ্চ এখানে সমাধান ভোট ... এবং ... এই এক সামনে 3 বছর পোস্ট stackoverflow.com/a/19481865/3578036

— JustCarty

Answer 6

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 "";
    }

Answer 7

ইউআরএল মান পাওয়ার সহজ এবং সহজ উপায়

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"

Answer 8

এক্সপ্রেসের সাথে কৌণিক ব্যবহার করার সময়

আমার উদাহরণে আমি রাউটিংয়ের সাথে কৌণিকটি ব্যবহার করছিলাম তাই using রুটপ্যারামগুলি ব্যবহার করে আমার রাউটিংয়ের সাথে বিশৃঙ্খলা হবে। আমি যা প্রত্যাশা করছিলাম তা পেতে নিম্নলিখিত কোডটি ব্যবহার করেছি:

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;
};

এটি একটি URL টেমপ্লেট এবং প্রদত্ত অবস্থানের পথ পায় path আমি কেবল এটি দিয়ে কল করেছি:

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

আমার কন্ট্রোলারটি এগুলি একসাথে রাখা:

.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);
}]);

ফলাফলটি হবে:

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

আশা করছি এটা ওখানে কাওকে সাহায্য করবে!