如何使用模板页面输出数据而不使用<a> tag?

时间:2016-06-05 13:55:31

标签: angularjs angularjs-templates

I'm working on an angularjs app, and I want to display data with a template page if possible. For example:

<div data-ng-view=""></div>

<input type="text" name="name" data-ng-model="post.name"/>
<input type="text" name="comment" data-ng-model="post.comment"/>
<button data-ng-click="">Post</button>

I usually do it by this way, but I just wondering is it possible that I could achieve it with a button?

<a href="#post/{{name}}">Post</a> //HTML

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider.
    when('/post/:name', {
        templateUrl: 'template.html', 
        controller: 'postCtrl'
    });
}]);

app.controller('postCtrl', function ($scope, $routeParams) {  
    $scope.name = $routeParams.name;
    $scope.comment = $routeParams.comment;
});

When the button is clicked, the inputed data would be display in the template page like this.

name1: this is a comment
name2: this is another comment

2 个答案:

答案 0 :(得分:1)

尝试$location.path()

HTML:

<button data-ng-click="postCall()">Post</button>

在控制器中注入$location依赖项:

app.controller('myCtrl', function ($scope, $location) {  
    $scope.postCall = function() {
       $location.path("#post/" + $scope.name)
    };
});

Documentation

答案 1 :(得分:0)

也许你需要这样的东西?

{{ name }}
<br>
{{ comment }}

在控制器中:

$scope.onClick = function () {
  $scope.name = 'this is name';
  $scope.comment = 'this is comment';
}