Question

我正在制作主页，并且有这么麻烦的事情。

localhost：9000 /此网址是我的主页。

主页顶部有三个类别，a，b，c。

当我点击a时，url将被更改为localhost：9000 / a

我可以看到显示一个句子“hello world！”的局部视图。它运作良好。

但是当我点击刷新（F5）时，视图显示{{sentence}}。

我认为我无法看到正确视图的原因是a.html无法加载资源。

只有main.html有一个完整的html结构。而其他html没有。

a.html只有

。

下面是javascript中的小代码块。

myApp.config(['$routeProvider','$locationProvider' ,function($routeProvider,$locationProvider){
    $routeProvider
        .when('/a',{
            templateUrl:'a',
            controller:'aCtrl'
....
}
myApp.controller('aCtrl',['$scope',function($scope){
    $scope.message = "hello world!";
}]);

这是路线

GET        /               controllers.Application.index
GET        /a              controllers.Application.a

这是Application.java

package controllers;

import play.*;
import play.mvc.*;

import views.html.*;

public class Application extends Controller {

    public static Result index() {
        return ok(index.render("Your new application is ready."));
    }

    public static Result a(){ return ok(a.render());}
}

那么有什么解决方案吗？我真的找不到解决方案。

或者角度是正常的吗？因为它是单页应用程序。

只有主页可以使用刷新（F5）。它显示了正确的视图。

请帮帮我!!!!!!! OTL

Answer 1

Play Framework和AngularJS都有一个路由系统，在你的例子中不能很好地匹配。

由于有几个选项可以匹配它们，我们假设您只想依赖AngularJS路由系统，并希望获得大量浏览器兼容性（请参阅AngularJS routing without the hash '#'）。

conf / routes ：您捕获到同一控制器的所有URL

GET     /$id<[a-c]?>                controllers.Application.index(id: String)
GET     /assets/*file               controllers.Assets.at(path="/public", file)

Application.scala ：索引函数在非根URL上添加＃符号，以便在AngularJS一侧触发路由更改

package controllers
import play.api._
import play.api.mvc._

object Application extends Controller {
  def index(id: String) = Action {
    if (id.nonEmpty) {
      Redirect("/#/"+id)
    } else {
      Ok(views.html.main("Hello"))
    }
  }
}

在AngularJS方面，您可能不必进行更改，导致AngularJS在您的描述中根据需要更改路线。作为参考，这是一个工作示例：

<强> main.js

var app=angular.module('main', ['ngRoute']);
app.config(function($routeProvider) {
    $routeProvider.when('/a',        {templateUrl: '../assets/tpl/a.html', controller: 'a'});
    $routeProvider.when('/b',        {templateUrl: '../assets/tpl/b.html', controller: 'b'});
    $routeProvider.otherwise(        {templateUrl: '../assets/tpl/default.html', controller: 'default'});
});
app.controller('default', function($scope, $http, $location) {
    console.log('default controller');
});
app.controller('a', function($scope, $http, $location) {
    console.log('controller a');
});
app.controller('b', function($scope, $http, $location) {
    console.log('controller b');
});

在angularJs中，播放框架，刷新后（F5）ng-view不起作用

{{sentence}}

1 个答案: