类型错误:无法读取未定义的属性“替换”。

I'm getting the above error when trying to use html5Mode with ui-router. Can anyone point me to what I'm doing wrong?

我在使用html5Mode和ui-router时遇到了上面的错误。有人能指出我做错了什么吗?

TypeError: Cannot read property 'replace' of undefined
    at bd (angular.js:10555)
    at Object.<anonymous> (angular.js:11403)
    at l.$get.l.$digest (angular.js:14222)
    at l.$get.l.$apply (angular.js:14493)
    at angular.js:1449
    at Object.e [as invoke] (angular.js:4182)
    at d (angular.js:1447)
    at sc (angular.js:1467)
    at Jd (angular.js:1361)
    at HTMLDocument.<anonymous> (angular.js:26086)

That segment in angular.js is:

在角段。js是:

10554 function trimEmptyHash(url) {
10555   return url.replace(/(#.+)|#$/, '$1');
10556 }

The routing file:

路由文件:

(function(){

    'use strict';

    angular
        .module('app')
        .config(routes);

        routes.$inject = ['$stateProvider', '$locationProvider'];

        function routes($stateProvider, $locationProvider) {

            // Configure app states
            $stateProvider

                .state('app', {
                    abstract: true, 
                    templateUrl: 'modules/app/app.html',                
                    controller: 'AppController'
                })

                .state('app.home', {
                    url: '/',
                    templateUrl: 'modules/home/index.html'
                });

            $locationProvider.html5Mode(true);
        }
})();

I've set the base url in the html:

我在html中设置了基本url:

<base href="/app/" />

5 个解决方案

#1

I ran into the same issue, and in my case the undefined "url" argument being passed to trimEmptyHash() was ultimately coming from the fact that $$absUrl propery on $location was not getting initialized. Digging in further, it appears that $$absUrl normally gets initialized in the $$compose() method, which typically gets called from $$parse() which typically gets called form the $$parseLinkUrl() method. Here is $$parseLinkUrl() (looking at Angular 1.4.1):

我遇到了同样的问题，在我的例子中，传递给trimEmptyHash()的未定义的“url”参数最终来自于$ localil的$$ propery没有被初始化这一事实。进一步挖掘，似乎$$荒谬通常会在$$组合()方法中初始化，该方法通常会从$$parse()中调用，通常被称为$$parseLinkUrl()方法。这里是$parseLinkUrl()(查看角度1.4.1):

this.$$parseLinkUrl = function(url, relHref) {
  if (relHref && relHref[0] === '#') {
    // special case for links to hash fragments:
    // keep the old url and only replace the hash fragment
    this.hash(relHref.slice(1));
    return true;
  }
  var appUrl, prevAppUrl;
  var rewrittenUrl;

  if ((appUrl = beginsWith(appBase, url)) !== undefined) {
    prevAppUrl = appUrl;
    if ((appUrl = beginsWith(basePrefix, appUrl)) !== undefined) {
      rewrittenUrl = appBaseNoFile + (beginsWith('/', appUrl) || appUrl);
    } else {
      rewrittenUrl = appBase + prevAppUrl;
    }
  } else if ((appUrl = beginsWith(appBaseNoFile, url)) !== undefined) {
    rewrittenUrl = appBaseNoFile + appUrl;
  } else if (appBaseNoFile == url + '/') {
    rewrittenUrl = appBaseNoFile;
  }
  if (rewrittenUrl) {
    this.$$parse(rewrittenUrl);
  }
  return !!rewrittenUrl;
};

In my case, the final "if" clause was not triggering the call to $$parse, because "rewrittenUrl" never got a value, because none of the if/else if clauses in the middle resolved to true. In my case, it was because the url I was using to serve the app (CompanyName/admin.html) was actually above the base Href that I set for the app (CompanyName/admin/), so none of the conditionals resolved to true. As soon as I changed my base Href to just CompanyName/, I no longer ran into this issue.

在我的例子中，最后的“if”子句没有触发对$parse的调用，因为“rewrittenUrl”没有得到值，因为中间的if/else if子句没有一个解析为true。在我的例子中，这是因为我用于服务应用程序的url (CompanyName/admin.html)实际上位于我为应用程序设置的基本Href (CompanyName/admin/)之上，因此没有一个条件被解析为true。当我把base Href改成CompanyName/时，我就不会再遇到这个问题了。

Alternatively, you could initialize $$absUrl on the location prototype, or wait for some kind of fix from Angular - watch this issue, and see the workaround proposed by joelmdev on March 30th.

或者，您可以在位置原型上初始化$荒诞，或者等待某种角度上的修复——查看这个问题，并查看joelmdev在3月30日提出的解决方案。

#2

I was seeing this exact same TypeError: Cannot read property 'replace' of undefined error when using html5mode too, until I changed:

我看到了同样的类型错误:在使用html5模式时，不能读取属性“替换”未定义的错误，直到我改变:

<base href="app/" />

来

<base href="/app/" />

Note, the missed preceding slash. Hope this can help someone.

注意，前面漏了一个斜杠。希望这能帮助某人。

#3

Your state 'app' have no url key defined.

您的状态“app”没有定义url键。

#4

What you should do is described here: ui-router on GitHub Once you configure server side routing, everything should work fine as long as you avoid opening you site with url like this: http://localhost/app-base#/

您应该做的是:GitHub上的ui-router，一旦配置了服务器端路由，只要避免使用以下url打开站点，一切都应该正常工作:http://localhost/app-base#

#5

-5

you have to remove this from html file

您必须从html文件中删除它

<base href="/app/" />

and this from app.js code

这来自app。js代码

$locationProvider.html5Mode(true);

#1

this.$$parseLinkUrl = function(url, relHref) {
  if (relHref && relHref[0] === '#') {
    // special case for links to hash fragments:
    // keep the old url and only replace the hash fragment
    this.hash(relHref.slice(1));
    return true;
  }
  var appUrl, prevAppUrl;
  var rewrittenUrl;

  if ((appUrl = beginsWith(appBase, url)) !== undefined) {
    prevAppUrl = appUrl;
    if ((appUrl = beginsWith(basePrefix, appUrl)) !== undefined) {
      rewrittenUrl = appBaseNoFile + (beginsWith('/', appUrl) || appUrl);
    } else {
      rewrittenUrl = appBase + prevAppUrl;
    }
  } else if ((appUrl = beginsWith(appBaseNoFile, url)) !== undefined) {
    rewrittenUrl = appBaseNoFile + appUrl;
  } else if (appBaseNoFile == url + '/') {
    rewrittenUrl = appBaseNoFile;
  }
  if (rewrittenUrl) {
    this.$$parse(rewrittenUrl);
  }
  return !!rewrittenUrl;
};