>웹 프론트엔드 >JS 튜토리얼 >ui-sref를 사용하여 매개변수를 전달하고 컨트롤러에서 검색하는 방법은 무엇입니까?

ui-sref를 사용하여 매개변수를 전달하고 컨트롤러에서 검색하는 방법은 무엇입니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-11-06 15:37:03238검색

How to Pass Parameters with ui-sref and Retrieve them in the Controller?

ui-sref로 매개변수 전달 및 컨트롤러에서 검색

문제

ui-sref를 사용하여 두 개의 매개변수를 상태에 전달해야 하며 상태 컨트롤러에서 액세스합니다. 그러나 컨트롤러에서 정의되지 않은 매개변수 값과 관련된 문제가 발생합니다.

해결책

ui-sref로 매개변수를 전달하고 컨트롤러에서 검색하려면 다음 단계를 따르세요.

  1. 상태 정의 업데이트:
$stateProvider
    .state('home', {
      url: '/:foo?bar', // Define parameter placeholders in the URL
      views: {
        '': {
          templateUrl: 'home.html',
          controller: 'MainRootCtrl'
        },
        ...
      }
    });
  1. 컨트롤러에서 $stateParams 사용:
.controller('MainRootCtrl', function($scope, $state, $stateParams) {
    var foo = $stateParams.foo; // Access fooVal
    var bar = $stateParams.bar; // Access barVal
})

세부적인 매개변수 구성

URL 매개변수 자리 표시자 외에도 상태 정의에서 params 객체를 사용하여 세부적인 매개변수를 정의할 수도 있습니다.

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

사용 예

ui-sref를 사용하여 매개변수를 전달하고 업데이트된 상태 정의로 검색하려면:

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

매개변수 구성 옵션

params 개체 설정에는 다음이 포함됩니다.

  • value: 기본 매개변수 값을 지정합니다.
  • array: 매개변수를 배열로 처리합니다.
  • squash: 방법을 구성합니다. 기본 매개변수 값은 URL에 표시됩니다.

자세한 내용은 URL 매개변수 및 $stateProvider에 대한 ui-router 설명서를 참조하세요.

위 내용은 ui-sref를 사용하여 매개변수를 전달하고 컨트롤러에서 검색하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.