2016-07-06 92 views
0

我尝试删除从URL hastag在我的网站上,但我不知道究竟是如何..AngularJS删除URL链接#

我研究了互联网上,我觉得这是neccesary插入位置提供者在我的控制器中,但是......在哪里?

这里对我的控制器代码:

'use strict'; 

(function() { 
    var app = angular.module('store', ['store-products']); 


    app.controller('StoreController', ['$log', function($log) { 

    this.products = gems; 
    $log.info('Dependency Info'); 
    }]); 

    app.controller('PanelController', function() { 
    this.tab = 1; 

    this.selectTab = function(setTab) { 
     this.tab = setTab; 
    }; 

    this.isSelected = function(checkTab) { 
     return this.tab === checkTab; 
    }; 
    }); 

    app.controller('ReviewController', function() { 
    this.review = {}; 

    this.addReview = function(product) { 
     product.reviews.push(this.review); 
     this.review = {}; 
    }; 

    }); 



    var gems = [ 
    { 
     name: 'Dodecahedron', 
     price: 2.95, 
     description: 'Dodecahedron description...', 
     images: [ 
     { 
      full: 'http://courseware.codeschool.com.s3.amazonaws.com/shaping-up-with-angular-js/images/gem-01.gif' 
     } 
     ], 
     canPurchase: true, 
     soldOut: false, 
     reviews: [ 
     { 
      stars: 5, 
      body: 'Awesome website', 
      author: '[email protected]' 
     }, 
     { 
      stars: 4, 
      body: 'Good!', 
      author: '[email protected]' 
     } 
     ] 
    }, 

    ]; 


})(); 

而且模块代码:

(function() { 
    var app = angular.module('store-products', []); 
    app.directive('productTitle', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'product-title.html' 
    }; 
    }); 
})(); 

此外,发现它neccesary在我的索引添加<base href="/">

但是,在哪里需要插入$ locationProvider命令? ($locationProvider.html5Mode(true);

编辑,这里是我的指数从页:

<!doctype html> 
    <html ng-app="store"> 

    <head> 
     <title>AngularJS App</title> 
     <meta charset="utf-8" /> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" /> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css" /> 
     <link rel="stylesheet" href="application.css" /> 
     <script src="app.js"></script> 
<base href="/"> 
     </head> 
    <body> 

     <h1>AngularJS App</h1> 

    <div class="container" ng-controller="StoreController as store"> 

     <h1>AngularJS App</h1> 

     <div ng-repeat="product in store.products"> 
      <h3> 
      <product-title></product-title> 
      </h3> 

      <section ng-controller="PanelController as panel"> 
      <ul class="nav nav-pills"> 
       <li ng-class="{active:panel.isSelected(3)}"><a href="#" ng-click="panel.selectTab(3)">Reviews</a></li> 
      </ul> 
      <div class="panel" ng-show="panel.isSelected(1)"> 
       <h4>Description</h4> 
       <blockquote>Product description...</blockquote> 
      </div> 
      <div class="panel" ng-show="panel.isSelected(2)"> 
       <h4>Specifications</h4> 
       <blockquote>None yet</blockquote> 
      </div> 
      <div class="panel" ng-show="panel.isSelected(3)"> 
       <h4>Reviews</h4> 
       <blockquote ng-repeat="review in product.reviews"> 
       <b>Stars: {{review.stars}}</b> 
       {{review.body}} 
       <cite>by: {{review.author}}</cite> 
       </blockquote> 
       <form name="reviewForm" ng-controller="ReviewController as reviewCtrl" ng-submit="reviewForm.$valid && reviewCtrl.addReview(product)" novalidate> 
       <blockquote> 
        <b>Stars: {{reviewCtrl.review.stars}}</b> 
        {{reviewCtrl.review.body}} 
        <cite>by: {{reviewCtrl.review.author}}</cite> 
       </blockquote> 
       <select ng-model="reviewCtrl.review.stars" required> 
        <option value="1">1 star</option> 
        <option value="2">2 star</option> 
        <option value="3">3 star</option> 
        <option value="4">4 star</option> 
        <option value="5">5 star</option> 
       </select> 
       <textarea ng-model="reviewCtrl.review.body" required></textarea> 
       <label>by:</label> 
       <input ng-model="reviewCtrl.review.author" type="email" required /> 

       <input class="btn" type="submit" value="Submit" /> 
       </form> 
      </div> 
      </section> 
      </div> 


     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.4/angular.min.js"></script> 
     <script src="products.js"></script> 
     <script src="app.js"></script> 
    </div> 



    </body> 



    </html> 

感谢帮我!

+0

你的'路由'已经定义了哪里,我看不到'ngRoute'也不包括在内。 –

+0

在我的索引中。对不起,我现在在原文中插入我的索引 –

+0

您错过了对Angular-route的依赖关系以及路由定义在哪里? – Weedoze

回答

2

你需要指定在配置HTML5的模式就像下面

var app = angular.module('store', ['store-products']) 
.config(['$locationProvider', function($locationProvider) { 
    $locationProvider.html5Mode(true); 
}]); 

了解更多关于hashbang模式和HTML5模式 [这里](https://docs.angularjs.org/guide/ $位置)