Question

我正在尝试使用angularJS加载html页面。

我的HTML页面如下：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>TSAPI Profiles list</title>
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://rawgit.com/angular/bower-angular/master/angular.min.js"></script>
<script src="main.js"></script>
<style type="text/css">
    .container{
        margin: 20px;
    }
</style>
</head>
<body>
    <div class="container" ng-app="TSAPIProfiles" ng-controller="TSAPIController">

        <div class="col-md-4">
        <p> <h4> TSAPI Profiles </h4> <br><br></p>
        </div>

        <table class="table table-bordered">

            <tbody>
                <tr>
                    <td>TSAPIProfile Name</td>
                    <td>ACD#</td>
                    <td>HUB...</td>
                </tr>
                <tr>
                    <td>AESServerPrimary</td>
                    <td>NorthACDTSAPI1</td>
                    <td>NorthACD</td>
                </tr>
                <tr>
                    <td>North</td>
                    <td>AESNorth1</td>
                    <td>ManualCBSDetails</td>
                </tr>
            </tbody>
        </table>
        <!-- Button -->
        <div class="btn-group-justified" >

              <div class="col-md-4" style="margin-left: 400px;" >
                <button name="savebutton" class="btn btn-primary" type="button" ng-click="add()">Add</button>
                <button name="resetbutton" class="btn btn-primary" type="button" ng-click="edit()">Edit</button>
                <button name="cancelbutton" class="btn btn-primary" type="button" ng-click="remove()">Remove</button>
              </div>
        </div>

    </div>
</body>
</html>

我的JS文件就像：

 var app = angular.module('TSAPIProfiles', [])
    app.controller('TSAPIController',['$scope','$location', function ($scope,$location) {
       $scope.add = function () {
        $location.path('TSAPIProfileCreate.html');
        }

    }]);

当我点击添加按钮时，它不会加载TSAPIProfileCreate.html。我无法找到原因。

Answer 1

$location.path('TSAPIProfileCreate.html'); // This is bad

$location.path返回斜杠之后不包括搜索字符串参数（在问号后面）的URL部分。

创建视图，然后使用$location.path。 https://docs.angularjs.org/api/ngRoute/directive/ngView

$location.path('TSAPIProfileCreate');

https://docs.angularjs.org/guide/ $位置

Answer 2

尝试按照Manikandan的回答，因为这是正确的方法（或使用ui-router），但如果您真的想要进行这样的重定向，请使用：$window.location.href this

在angularJS中使用$ location.path时页面不加载

2 个答案: