ASP.Net MVC Angular 2 最终版

2024-03-10

有人尝试过 Angular 2 RC Final 和 ASP.Net MVC 吗?

我在使用 ASP.Net MVC 配置 Angular 2 RC 6 时遇到问题,直到 beta 17 一切正常。

具有以下配置的 package.json 似乎不起作用:

"dependencies": {
    "@angular/common": "2.0.0-rc.6",
    "@angular/compiler": "2.0.0-rc.6",
    "@angular/core": "2.0.0-rc.6",
    "@angular/forms": "0.3.0",
    "@angular/http": "2.0.0-rc.6",
    "@angular/platform-browser": "2.0.0-rc.6",
    "@angular/platform-browser-dynamic": "2.0.0-rc.6",
    "@angular/router": "3.0.0-rc.1",

    "systemjs": "0.19.27",
    "core-js": "^2.4.0",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.6",
    "zone.js": "^0.6.12",

  },

恢复包会在输出窗口中显示以下输出:

====Executing command 'npm install'====


npm WARN package.json @ No description
npm WARN package.json @ No repository field.
npm WARN package.json @ No README data
npm http GET http://registry.npmjs.org/systemjs
npm http GET http://registry.npmjs.org/angular/compiler
npm http GET http://registry.npmjs.org/angular/core
npm http GET http://registry.npmjs.org/angular/http
npm http GET http://registry.npmjs.org/angular/platform-browser
npm http GET http://registry.npmjs.org/angular/platform-browser-dynamic
npm http GET http://registry.npmjs.org/angular/router
npm http GET http://registry.npmjs.org/angular/router-deprecated
npm http GET http://registry.npmjs.org/angular/common
npm http GET http://registry.npmjs.org/reflect-metadata
npm http GET http://registry.npmjs.org/angular/upgrade
npm http 304 http://registry.npmjs.org/systemjs
npm http 404 http://registry.npmjs.org/angular/platform-browser
npm http 404 http://registry.npmjs.org/angular/core
npm ERR! 404 Not Found
npm ERR! 404 
npm ERR! 404 'angular/platform-browser' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, or http url, or git url.
npm ERR! System Windows_NT 6.2.9200
npm ERR! command "C:\\Program Files (x86)\\Microsoft Visual Studio 14.0\\Common7\\IDE\\Extensions\\Microsoft\\Web Tools\\External\\\\node\\node" "C:\\Program Files (x86)\\Microsoft Visual Studio 14.0\\Common7\\IDE\\Extensions\\Microsoft\\Web Tools\\External\\npm\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! cwd D:\User\MyProject-MVC6\src\MyProject
npm ERR! node -v v0.10.31
npm ERR! npm -v 1.4.9
npm ERR! code E404
npm http 404 http://registry.npmjs.org/angular/http
npm http 404 http://registry.npmjs.org/angular/compiler
npm http 404 http://registry.npmjs.org/angular/router-deprecated
npm http 404 http://registry.npmjs.org/angular/router
npm http 404 http://registry.npmjs.org/angular/platform-browser-dynamic
npm http 304 http://registry.npmjs.org/reflect-metadata
npm http 404 http://registry.npmjs.org/angular/common
npm http 404 http://registry.npmjs.org/angular/upgrade
npm

====npm command completed with exit code 1====

将 Angular2 RC 6 与 ASP.Net MVC 一起使用的分步说明将受到高度赞赏。


修好了!如果有人仍在努力让 Angular 2 Final 与 ASP.Net MVC 配合使用,请分享详细信息

让我感谢Barry https://stackoverflow.com/users/5011872/barry and Brando https://stackoverflow.com/users/3532945/brando寻求他们在不同点的指导。

我能够通过以下步骤修复上述错误:

Visual Studio 2015 是附带一个非常旧的版本npm 的。因此,您需要做的第一件事就是从以下位置下载并安装最新版本的 Node:https://nodejs.org/en/ https://nodejs.org/en/(我安装的是v6.1.0,当前最新的)。

安装后,您需要告诉 Visual Studio 使用最新版本的节点而不是嵌入的旧版本。为此,请按照以下步骤操作:

  1. 在 Visual Studio 中,从顶部菜单转到“工具”>“选项”
  2. 展开对话框中显示的项目和解决方案节点
  3. 选择外部网络工具
  4. 添加指向 C:\Program Files\nodejs 的新条目 (或者到你安装nodejs的位置)
  5. 将其移至列表顶部。
  1. 重新启动 Visual Studio 并恢复 npm 包。

这应该可以修复上述错误,但是现在如果您尝试编译该项目,您可能会看到很多错误,主要是由于缺少类型定义,例如:

严重性代码 说明 项目文件行抑制状态
错误 TS6053 构建:找不到文件 /node_modules/angular2/ts/typings/jasmine/jasmine.d.ts'

增强中的模块名称无效,找不到模块“../../Observable”。
TypeScript 虚拟项目node_modules\rxjs\add\operator\zip.d.ts

“Observable”类型上不存在属性“map”。

要修复上述错误,您只需在 main.ts 或 bootstrap.ts 顶部添加以下链接即可:

///<reference path="./../typings/browser/ambient/es6-shim/index.d.ts"/>

这应该可以修复上述打字错误。

通过 RC,Angular 团队将所有组件作为单独的文件提供。因此,过去如果您能够将 Angular 包作为打包文件 angular2.dev.js (或 min 文件)包含在索引文件中,那么现在就行不通了。所需的组件需要包含在您的应用程序所需的索引中。您可以使用 systemjs.config.js 来添加依赖项。我强烈建议您阅读官方快速入门指南,特别是这一部分:

Link: https://angular.io/guide/quickstart https://angular.io/guide/quickstart

即使按照上述步骤进行正确配置后,当您运行应用程序时,您可能会看到 404,因为缺少 Angular 文件。

原因是,默认情况下 ASP.Net 5 在 /wwwroot/node_modules/ 文件夹中查找 Angular 依赖项。由于node_modules位于项目根文件夹中而不是wwwroot文件夹中,因此浏览器返回404(未发现错误)。因此,将 @angular 文件夹从 node_modules 文件夹移动到 wwwroot 应该可以解决该问题。

地图错误

在某些情况下,升级 TypeScript 版本还会修复地图错误:

尝试按照以下步骤升级到 TypeScript 2: - 在 Visual Studio 中单击“工具”>“扩展和更新” - 从对话框左侧显示的列表中选择“在线” - 搜索 TypeScript - 从搜索结果中安装适用于 Microsoft Visual Studio 2015 的 TypeScript 2.0 Beta。 - 重新启动计算机,希望它能修复所有地图错误

希望这可以帮助。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ASP.Net MVC Angular 2 最终版 的相关文章

随机推荐

  • 使用 Twilio 和 SIP 进行 SMS 消息传递

    我正在尝试使用 Twilio 在我的 iPhone 上发送和接收短信 我已设置呼入和呼出呼叫遵循这些说明 https stackoverflow com questions 48346740 how do i forward a twili
  • Azure Functions 错误 - 无法将参数绑定到字符串类型

    我正在尝试使用 Azure 函数将文件保存到 FTP json是这样的 type apiHubFile name outputFile path folder ps DateTime txt connection ftp FTP direc
  • 如何读入边列表以制作 scipy 稀疏矩阵

    我有一个大文件 其中每行都有一对 8 个字符串 就像是 ab1234gh iu9240gh 在每行上 这个文件实际上代表了一个图 每个字符串都是一个节点 ID 我想读入文件并直接制作一个 scipy 稀疏邻接矩阵 然后 我将使用 pytho
  • “没有这样的模块‘Alamofire’”Xcode 无法识别 Alamofire 框架

    我意识到在其他问题中也提出了同样的错误 例如here https stackoverflow com questions 25817479 cannot install alamofire in new xcode project no s
  • CakePHP 仅在输入数据时进行表单验证

    我正在尝试上传其中一个模特的照片 并且当我进入编辑模式时 当用户只想编辑与该记录相关的文本时 它仍然要求我上传照片 以下是我的验证规则 display photo gt array uploadError gt array rule gt
  • 读取音频文件信息php

    如何从声音文件中读取比特率 长度等信息 不同的文件格式 mp3 wmw 等 我想那里有一些图书馆 课程 也许我可以尝试一下 有什么建议么 getID3 http getid3 org 是一个 PHP 脚本 可以从 MP3 和其他多媒体文件格
  • Android ProgressBar 的样式类似于 SwipeRefreshLayout 中的进度视图

    I use android support v4 widget SwipeRefreshLayout在我的 Android 应用程序中 它包裹着一个ListView 列表视图的内容是从服务器下载的 当用户向下滑动以从服务器重新加载数据时 会
  • Docker - 无法从容器内部 ping 主机子网上的任何内容

    我有一台 IP 地址为 192 168 11 10 的 Mac 主机 我有一个使用默认网络配置运行的 docker compose 项目 我需要从 docker 容器内连接到 IP 地址 192 168 11 11 上的设备 从容器内 我可
  • jUnit 在多种文化中测试 Double.toString

    我有一个开源库 其中有大量比较字符串形式的数字的单元测试 这些测试通过良好en GB en US以及其他文化中数字通常以以下形式书写1 234 00 然而 在德国和法国等文化中 这些值的格式不同 因此测试会失败 如何强制 jUnit 测试运
  • R - 查找包含所有字符串/模式的所有向量元素 - str_detect grep

    样本数据 files in path c a 4 0 name 2015 NY RDS b 4 0 name 2016 CA RDS c 4 0 name 2015 PA RDS strings to find c 4 0 PA 我想要一个
  • 多个表行作为backbone.js 视图?

    所以我有一个数据网格 网格中的每个项目都有一个关联的模型和视图 我需要将每个项目渲染为two表行以实现所需的 UI 不 这不是我的设计 第一次尝试 在视图中render 方法 只需渲染两行并将它们添加到this el 然后我将每个视图附加到
  • 将向量转换为向量(优雅的方式)

    我想知道是否有一种优雅的方式或内置函数来转换vector
  • 在绑定到 Winforms 数据源的 gridview 的 bool 列中显示是/否?

    我有一个绑定到数据源 Windows 窗体 VB NET 的 gridview 其中一列是布尔类型的属性 我想在该列中显示 是 否 而不是 0 1 或 真 假 这可能吗 您可以编辑绑定列的显示吗 我遇到了同样的问题 不幸的是我没有找到优雅的
  • 使用 Tensorflow 对象检测 api 打乱训练数据集

    我正在使用 Faster RCNN 模型和 Tensorflow 对象检测 API 来开发徽标检测算法 我的数据集按字母顺序排列 因此有一百个阿迪达斯徽标 然后是一百个苹果徽标等 我希望在训练时对其进行洗牌 我在配置文件中添加了一些值 tr
  • UIResponder 问题

    今晚我一直在与 UIResponder 作斗争 这是我的困境 如果我输入 BOOL canBecomeFirstResponder return YES 到我的 mainViewController 然后我可以获得摇动事件 void mot
  • 无法打开流:是一个目录

    我在尝试使用 php 将上传的文件从临时文件夹移动到所需的文件时收到以下警告 警告 move uploaded file test function move uploaded file 无法打开流 是第 69 行 home filenam
  • MySQL 8 中索引 JSON 列

    所以我正在尝试 json 列 Mysql 8 0 17 应该可以使用多值 JSON 索引 如下所示 CREATE INDEX data nbr idx ON a1 CAST data gt nbr AS UNSIGNED ARRAY 我有像
  • 如何使用 JavaScript 函数验证字段?

    我创建了一个表单 从文档中的示例 https getbootstrap com docs 4 0 components forms在 验证 自定义样式 部分 我在 cumpolsory 输入中添加了 必需 属性 并且验证进展顺利 现在我需要
  • 如何将自定义 Lambda 层包含到管道堆栈中? (AWS-CDK)

    我有两堆 应用栈 管道栈 将自定义 lambda 层包含到管道堆栈中以便将代码位置信息中继回我的应用程序堆栈的官方方法是什么 我已经按照文档使常规 lambdas 工作 在这里找到 https docs aws amazon com cdk
  • ASP.Net MVC Angular 2 最终版

    有人尝试过 Angular 2 RC Final 和 ASP Net MVC 吗 我在使用 ASP Net MVC 配置 Angular 2 RC 6 时遇到问题 直到 beta 17 一切正常 具有以下配置的 package json 似