如何在Angular页面中使用路由参数?

时间:2015-08-01 13:39:49

标签: javascript angularjs

我有一个页面,该页面应位于地址http://localhost:8080/#/edit/someId,其中someId是要编辑的对象的ID。

为了做到这一点,我写了以下路线:

angular.module('myapp', [ 'ngRoute' ]).config(function($routeProvider,
$httpProvider) {
    $routeProvider.when('/', {
        templateUrl : 'projects.html',
        controller : 'projects'
    }).when('/edit/:id', {
        templateUrl : 'edit.html',
        controller : 'edit'
    })
    [...]
    .otherwise('/');
    $httpProvider.defaults.headers.common['X-Requested-With'] =
        'XMLHttpRequest';
})
[...]
.controller('edit', function($scope, $http, $routeParams) {
    $scope.projectid = $routeParams.id;
    console.log("projectid in handler: " + $routeParams.id);
    var projectid = $routeParams.id;
});

edit.html看起来像这样:

<div ng-show="authenticated">
    <div id="cesiumContainer"></div>
    <div class="toolbar-left">
        [...]
    </div>
    <script>

        var mode = 'nothing';
        var viewer = "undefined";

        console.log("projectid: " + projectid);

        // I need projectid here to initialize the Cesium viewer.

        if (typeof Cesium !== "undefined") {
            startup(Cesium, projectid);
        } else if (typeof require === "function") {
            require(["Cesium", projectid], startup);
        }
    </script>
</div>
<div ng-show="!authenticated">
    <p>Please login.</p>
</div>

当我在浏览器中输入http://localhost:8080/#/edit/someId时,

  1. projectid in handler:开头的消息(在路线中定义)不会显示在日志和
  2. projectid未在edit.html中定义。
  3. 如何更改我的代码,以便当我输入http://localhost:8080/#/edit/someId时,someId中的script块中可以使用edit.html

0 个答案:

没有答案