簡體   English   中英

重定向到Angular JS中的按鈕單擊頁面

[英]Redirect to page on button click in angular js

添加音樂后,我想在取消和保存時在主頁上重定向。

var app = angular.module("musicApp", ["ngRoute"]);
app.config(function($routeProvider) {
  $routeProvider.when("/Items", {
      templateUrl: "view-list.html",
      controller: "listController"
    })
    .when("/Items/add", {
      templateUrl: "view-detail.html",
      controller: "addController"
    })
    .when("/Items/:index", {
      templateUrl: "view-detail.html",
      controller: "editController"
    })
    .otherwise({
      redirectTo: "/Items"
    });
});


app.factory("productService", ["$rootScope", function($rootScope){
  var service={};
  var data = [{
      name: "Artist1",
      genre: "Genre1",
      rating: "Rating1"
    }, {
      name: "Artist2",
      genre: "Genre2",
      rating: "Rating2"
    }];

    service.getProducts = function(){};
    service.addProduct = function(product){};
    service.editProduct = function(product){};
  return service;
}]);
app.controller("listController", ["$scope", "$location", "$routeParams",
  function($scope, $location, $routeParams) {

    $scope

    $scope.addProduct = function() {
      $location.path("/Items/add");
    };

    $scope.editItem = function(index) {
      $location.path("/Items/" + index);
    };

  }
]);

app.controller("addController", ["$scope", "$location", "$routeParams",
  function($scope, $location, $routeParams) {
    $scope.save = function() {
      $location.url("/Items");
    };
    $scope.cancel = function() {
      $location.path("/Items");
    };
  }
]);


app.controller("editController", ["$scope", "$location", "$routeParams",
  function($scope, $location, $routeParams) {
    $scope.save = function() {
      $location.path("/Items");
    };
    $scope.cancel = function() {
      $location.path("/Items");
    };
  }
]);

主頁上的主要部分如下:

app.controller("addController", ["$scope", "$location", "$routeParams",
  function($scope, $location, $routeParams) {
    $scope.save = function() {
      $location.url("/Items");
    };
    $scope.cancel = function() {
      $location.path("/Items");
    };
  }
]);

它不會將我重定向到列出所有產品的主頁。

視圖detail.html

<div class="form-group">
  <label for="txtName">Product Name</label>
  <input type="text" id="txtName" class="form-control" data-ng-model="item.name" />
</div>

<div class="form-group">
  <label for="cboGenre">Genre</label>
  <input type="text" id="cboGenre" class="form-control" data-ng-model="item.genre"/>
</div>

<div class="form-group">
  <label for="cboRating">Rating</label>
  <input type="text" id="cboRating" class="form-control" data-ng-model="item.rating"/>
</div>

<div class="form-group">
  <button class="btn bth-primary" data-ng-click="save()">Save</button>
  <button data-ng-click="cancel()" class="btn bth-primary">Cancel</button>
</div>

你忘了" "雙引號中的data-ng-model=item.name它應該是data-ng-model="item.name"

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM