角与DevExtreme
角与DevExtreme
提问于 2015-06-22 20:09:47
我在DevExtreme中使用角度法。
我只是试着运行这段代码，但到目前为止，我还没有运行。
这是我的HTML：
<!doctype html>
<html ng-app="myCalc">
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="js/libs/angular.js/angular.js" type="text/javascript"></script>
<script src="js/libs/angular.js/angular-sanitize.js" type="text/javascript"></script>
<script src="js/libs/angular.js/angular-resource.js" type="text/javascript"></script>
<script src="js/libs/angular.js/angular-route.js" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/globalize/0.1.1/globalize.min.js"></script>
<script src="js/libs/angular.js/dx.webapp.js" type="text/javascript"></script>
<script src="script.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="http://cdn3.devexpress.com/jslib/15.1.3/css/dx.common.css" />
<link rel="stylesheet" type="text/css" href="http://cdn3.devexpress.com/jslib/15.1.3/css/dx.light.css" />
<script src="js/libs/angular.js/dx.all.js" type="text/javascript"></script>
</head>
<body ng-controller="AppCtrl" >
<form>
<br>
<br>
Parameter 1:
<input type="text" ng-model="param1">
<br>
<br>
Parameter 2:
<input type="text" ng-model="param2">
</form>
<br>
<br>
<div dx-button="{
text: 'Sample GET',
clickAction: click()
}"></div>
<br>
<div>Sum: {{data}}</div>
<br>
</body>
这是我的剧本：
(function(angular) {
'use strict';
angular.module('myCalc', [ 'dx' ] )
angular.module('myCalc', ['ngRoute'])
.controller('AppCtrl', function($scope, $http, $templateCache) {
$scope.click = function(url) {
$scope.url = url;
$http.get($scope.url, {
params: {
param1: $scope.param1,
param2: $scope.param2
},
cache: $templateCache
}).
success(function(data) {
$scope.data = data;
}).
error(function(data) {
$scope.data = data || "Request failed";
});
};
})
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('http://localhost:8000/calc', {
templateUrl: 'index.html',
controller: 'AppCtrl'
});
// configure html5 to get links working on jsfiddle
$locationProvider.html5Mode(true);
});
})(window.angular);另外，我在NodeJS中有一个服务器，如：
var url = require('url');
//Require express,
var express = require('express');
//and create an app
var app = express();
//app.get() which represents the HTTP GET method
app.get('/', function (req, res) {
res.send('Hello World!');
});
//app.get() which represents the HTTP GET method param1/:param1/param2/:param2
app.get('/calc', function (req, res) {
url_parts = url.parse(req.url, true);
console.log(url);
console.log(url_parts);
a = parseInt(url_parts.query.param1);
console.log(a);
b = parseInt(url_parts.query.param2);
console.log(b);
output = a+b;
console.log(output);
res.writeHead(200, {
'Content-Type': 'text/html',
'Access-Control-Allow-Origin' : '*'});
res.end(output + "\n");
});
var server = app.listen(8000, function () {
var host = server.address().address;
var port = server.address().port;
console.log('Example app listening at http://' + host + ':' + port);
});发生什么事了，我没有运行这段代码？有人能帮我吗？
谢谢罗德里戈
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-06-23 20:26:17
我已经按照描述的这里更新了您的应用程序
主要的区别是在ng-view文件中使用ng-controller而不是ng-controller。此外，还有一些小的代码重构。
您可以在这里下载这个简单的项目- https://www.dropbox.com/s/ayc00jb0gg7xfdl/ng.zip?dl=0并在您的本地web服务器上运行它。
希望能帮上忙！
Upd
这个文章逐步描述了如何在DevExtreme框架中使用DevExtreme小部件。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30988935
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号