ui-sref를 사용하여 UI-Router의 상태에 매개변수를 어떻게 전달합니까?

ui-sref를 사용하여 UI-Router에서 매개변수 전달 이해

UI-Router에서 ui-sref를 통해 전환할 때 매개변수를 상태에 전달하려면 특정 구성이 필요합니다. 각 단계를 자세히 살펴보겠습니다.

1. URL 매개변수 정의:

주의 url 속성에서 예상되는 URL 매개변수를 정의합니다. 구문은 :paramName? 여기서 paramName은 수신하려는 매개변수입니다. 예:

.state('home', {
  url: '/:foo?bar',

2. ui-sref에 매개변수 값 할당:

매개변수 값을 ui-sref에 중괄호 내의 개체로 전달합니다. 구문은 ui-sref="stateName({paramName: 'value', ...})"입니다. 예:

<a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home with foo and bar parameters</a>

3. 컨트롤러에서 $stateParams 활용:

대상 상태의 컨트롤러에서 전달된 매개변수가 포함된 $stateParams를 삽입합니다. $stateParams.paramName을 사용하여 값을 검색합니다. 예:

app.controller('SomeController', function($scope, $stateParams) {
  var foo = $stateParams.foo;
  var bar = $stateParams.bar;
})

4. URL이 아닌 매개변수 전달:

URL의 매개변수 외에도 상태의 매개변수 구성에서 추가 매개변수를 정의할 수 있습니다. 이를 통해 URL의 일부가 아닌 매개변수를 전달할 수 있습니다. 예:

.state('home', {
  url: '/:foo?bar',
  params: {
    foo: { value: 'defaultValue', squash: false, },
    hiddenParam: 'YES'
  }

params에 정의된 매개변수는 $state.go() 또는 ui-sref를 사용하여 전달할 수 있습니다. URL에는 포함되지 않습니다.

5. 배열 매개변수:

params 구성에서 array: true를 설정하여 매개변수를 배열로 선언할 수도 있습니다. 예:

params: {
  bar: { array: true, }
}

배열 값을 전달할 때 대괄호를 사용해야 합니다.

<a ui-sref="home({foo: 'fooVal1', bar: ['barVal1', 'barVal2']})">...</a>

위 내용은 ui-sref를 사용하여 UI-Router의 상태에 매개변수를 어떻게 전달합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!