Question

我有一个index.html页面，我正在使用ng-view。这两个HTML模板是page1和page2。

我有一个附加了ng-click功能的按钮。触发该函数后，我将使用$resource和amcharts dataloader内的天气URL来获取天气数据，以根据天气信息绘制图表。

现在，如果我不分开模板并将所有内容都保留在一页上，则一切正常。但是，当我分离它们并从index.html页面获取输入时，没有任何效果。我猜是因为加载page1和page2时，该函数获取的信息会丢失。

是否有一种优雅的方法？理想情况下，我希望index.html接受用户输入。就像“进入城市”一样，我希望在加载/page1时应该有天气数据，并且在page2上应该有天气图，而无需再次征求用户的输入。

现在，我在page1中接受输入，但理想情况下，我希望它位于main index.html中。

我确定代码正确无误，并且正确使用了路由，这更多是与执行的逻辑和优先级有关的错误。

我对angularjs还是很陌生。所以请:)

JavaScript

$app.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'page1.html',
            controller: 'weatherController'
        })
        .when('/graph', {
            templateUrl: 'page2.html',
            controller: 'weatherController'
        })
        .otherwise({
            redirectTo: '/'
        })
});

app.controller('weatherController', ['$scope', '$resource', '$routeParams', function($scope, $resource, $routeParams) {
    $scope.GetWeatherInfo = function() {
        // getting weather data for page1.html
        // getting chart data for page2.html
        ...
    }
}]);

HTML （Page1.html）

<div ng-controller="weatherController">

<input type="text" name="city" id="city" class="form-control" placeholder="Stadt" ng-model="city_name" /> 
<button id="submitWeather" class="btn btn-primary" ng-click="GetWeatherInfo()"> zum Wetter </button>

Temperature:        Min: {{w.main.temp_min}} 
                    Max: {{w.main.temp_max}}

HTML （Page2.html）

<div ng-controller="weatherController">
<div id="chartdiv"></div>

加载ng-view html模板

0 个答案: