如何将带URL的数据传递给ui-sref?

时间:2022-01-09 11:02:35

I ny view I have: <a ui-sref="app.file({path: file.path})">{{ file.path }}</a>

我认为我有: {{file.path}}

file.path is html/hero-sidebar.html

file.path是html / hero-sidebar.html

My state is defined as:

我的州定义为:

  .state('app.file', {
    url: '/file/*path'
    views:
      repositoryView:
        templateUrl: '/templates/app/_file.html'
  })

But when I click the link, it goes to http://localhost:9001/app/file/html%252Fhero-sidebar.html

但是当我点击链接时,它会转到http:// localhost:9001 / app / file / html%252Fhero-sidebar.html

What I want is for it to go to http://localhost:9001/app/file/html/hero-sidebar.html

我想要的是它去http:// localhost:9001 / app / file / html / hero-sidebar.html

Is this possible using ui-router with AngularJS?

这是否可以使用带AngularJS的ui-router?

1 个解决方案

#1


2  

There is already logged issue in ui-router Github, you could found it here

在ui-router Github中已经记录了问题,你可以在这里找到它

In order to solve this you need to add this code inside your config which will take care of encoding and decoding of url.

为了解决这个问题,你需要在你的配置中添加这个代码,它将负责url的编码和解码。

you could override the built-in string type (which is performing the slash encoding) by registering your own replacement "string" type using below code

您可以通过使用下面的代码注册您自己的替换“字符串”类型来覆盖内置字符串类型(执行斜杠编码)

Code

app.config(['$urlMatcherFactory', '$stateProvider', function($urlMatcherFactory, $stateProvider) {
    //$stateProvider.state() & other code here

    function valToString(val) {
        return val != null ? val.toString() : val;
    }

    function regexpMatches(val) { /*jshint validthis:true */
        return this.pattern.test(val);
    }
    $urlMatcherFactory.type("string", {
        encode: valToString,
        decode: valToString,
        is: regexpMatches,
        pattern: /[^/]*/
    });
}]);

Working Plunkr

#1


2  

There is already logged issue in ui-router Github, you could found it here

在ui-router Github中已经记录了问题,你可以在这里找到它

In order to solve this you need to add this code inside your config which will take care of encoding and decoding of url.

为了解决这个问题,你需要在你的配置中添加这个代码,它将负责url的编码和解码。

you could override the built-in string type (which is performing the slash encoding) by registering your own replacement "string" type using below code

您可以通过使用下面的代码注册您自己的替换“字符串”类型来覆盖内置字符串类型(执行斜杠编码)

Code

app.config(['$urlMatcherFactory', '$stateProvider', function($urlMatcherFactory, $stateProvider) {
    //$stateProvider.state() & other code here

    function valToString(val) {
        return val != null ? val.toString() : val;
    }

    function regexpMatches(val) { /*jshint validthis:true */
        return this.pattern.test(val);
    }
    $urlMatcherFactory.type("string", {
        encode: valToString,
        decode: valToString,
        is: regexpMatches,
        pattern: /[^/]*/
    });
}]);

Working Plunkr