codememo

Angularjs $state 새 탭의 링크 열기

tipmemo 2023. 2. 12. 17:55
반응형

Angularjs $state 새 탭의 링크 열기

$state.go 함수를 사용하여 "새로운 탭에 링크 열기" 기능을 구현하려고 합니다.다음과 같은 smth가 있으면 정말 좋을 것 같아요.

$state.go('routeHere', {
    parameter1 : "parameter"
    }, {
    reload : true,
    newtab : true // or smth like target : "_blank"
});

AngularJS를 사용해서 할 수 있는 방법이 있나요?

업데이트: 네, 방금 다음 코드를 사용하여 문제를 해결했습니다.

var url = $state.href('myroute', {parameter: "parameter"});
window.open(url,'_blank');

방금 해봤는데... 분명히, 추가해서target="_blank"와 연동하다ui-sref:

<a ui-sref="routeHere" target="_blank">A Link</a>

컨트롤러에 코드를 추가하는 수고를 덜고 일반 링크와 마찬가지로 URL을 호버에 표시합니다.윈윈!

저도 비슷한 문제가 있었습니다만, 이전 답변에서 문제가 없으면 이 방법을 사용해 보십시오.

var url = '#' + $state.href('preview');
window.open(url,'_blank');

즉, 기본적으로 로컬호스트에서 작업하는 동안 추가 없이 로컬호스트에 리다이렉트만 하면

로컬 호스트/로컬 호스트

대신

localhost/Project_Name/#/preview

데이터 전달에 대해 말하는 것이 아니라 $state를 새 탭에서 열려고 합니다.

앱이 하위 폴더에 있는 경우 localhost에서 작동하지 않을 수 있습니다.사실 저도 같은 문제가 있었어요.

온라인으로 시험해 본 결과, 이하의 방법으로 정상적으로 동작했습니다.

<a ui-sref="routeHere" target="_blank">Link</a>
ui-sref="routeHere" href=""target="_blank"

이 코드가 내 문제를 해결했다.

이것을 앵커 태그에 사용합니다.

제가 찾은 가장 좋은 답변은 ui.router를 확장한 것입니다.기능은 빌트인이 없기 때문입니다.상세한 것에 대하여는, 여기를 참조해 주세요.

Angular 1.x UI 라우터의 $state.go 확장

단, app.js 또는 angular app init 파일에 추가해야 하는 간단한 설명은 다음과 같습니다.

angular.module("AppName").config(['$provide', function ($provide) {
    $provide.decorator('$state', ['$delegate', '$window',
        function ($delegate, $window) {
            var extended = {
                goNewTab: function (stateName, params) {
                    $window.open(
                        $delegate.href(stateName, params, { absolute: true }), '_blank');
                }
            };
            angular.extend($delegate, extended);
            return $delegate;
        }]);
}]);

고객님의 코드로

다음을 수행할 수 있습니다.

$state.goNewTab('routeHere', { parameter1 : "parameter"});

이거 먹어봐!

<a ui-sref="routeHere({parameter: vm.parameter})" target="_blank"></a>

언급URL : https://stackoverflow.com/questions/23516289/angularjs-state-open-link-in-new-tab

반응형