如何在angular 1.6 / es6应用程序中访问form对象？
在Angular 1.6 / ES6应用程序中访问form对象，可以通过以下步骤实现：
- 在HTML模板中，使用ng-form指令或者在form标签上添加name属性来创建一个表单。例如：
<form name="myForm">
<!-- 表单字段 -->
</form>- 在控制器中，通过$scope对象访问表单对象。首先，确保在控制器中注入$scope对象。然后，可以使用$scope对象的属性来访问表单对象。例如：
app.controller('myController', ['$scope', function($scope) {
// 访问表单对象
var form = $scope.myForm;
// 使用表单对象进行操作
}]);- 现在，可以使用表单对象来访问表单的各种属性和方法。以下是一些常用的属性和方法：
- $valid：表单是否有效
- $invalid：表单是否无效
- $pristine：表单是否未被修改
- $dirty：表单是否已被修改
- $submitted：表单是否已被提交
- $setPristine()：将表单标记为未被修改
- $setDirty()：将表单标记为已被修改
- $setSubmitted()：将表单标记为已被提交
- $error：包含表单验证错误的对象
例如，可以使用以下代码检查表单的有效性并获取表单字段的值：
if (form.$valid) {
var value = form.fieldName.$modelValue;
// 对表单字段的值进行操作
}这是在Angular 1.6 / ES6应用程序中访问form对象的基本方法。根据具体的应用场景，可以使用不同的Angular指令和方法来处理表单验证、提交等操作。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云人工智能：https://cloud.tencent.com/product/ai
- 腾讯云物联网通信（IoT Hub）：https://cloud.tencent.com/product/iothub
- 腾讯云移动推送（TPNS）：https://cloud.tencent.com/product/tpns
相关·内容
3回答
我正在处理一个角度应用程序，我有一个包含iframe的视图(这个iframe的目的只是显示一个登录表单)。
就像我试图手动提交表单失败一样，我试图记录这个公式以检查我是否真的能够达到它，但我对如何做到这一点感到困惑。
iframe中的表单具有名称属性myForm
<iframe id="myIframe" name="myIframe" src="someUrl.com">
<html>
...
<form name="myForm" class="form&#
浏览 4提问于2015-07-22得票数 1
我正在开发一个使用angular 1.6和es6的应用程序。我有一张表格：
<form name="foobar" ng-submit="$ctrl.submitThat()" novalidate>
在submitThat()函数中，我想访问form对象并检查其验证状态，但它似乎在$scope对象上不可用。$scope对象存在，我确保将其作为控制器类的构造器的参数传递，但它没有"foobar“属性(表单名称)。
class StuffController {
/*@ngInject*/
constructor($translate, St
浏览 3提问于2017-02-24得票数 3
回答已采纳
对于任何使用过angular js 1.6的人来说，这听起来都很简单。我是一个初学者，需要在我的view.html页面上使用ng-if标签来显示隐藏一个div，这是基于我在angular js1.6中从web api end收到的一个标志。 web api使用.Net框架开发，前端使用angular 1.6。我的标签是这样的： <div class="form-group" ng-if="IsMyFlag == true">
<div class="c
浏览 29提问于2020-03-17得票数 0
是否有任何转换器或技术可用于将Javascript 1.7代码及其新的语言特性转换为Javascript 1.6？
我最感兴趣的是迭代器生成器和yield关键字。我使用的脚本引擎只有1.6，但是迭代器生成器可以提供更好的代码。用手写似乎很复杂。
我尝试用C#编写它，用ILSpy进行反编译，并手工将它移植到Javascript。但那真是一团糟。
我已经搜索过这样一个转换器，但我什么也没有找到--也许是因为在这种情况下，搜索词与无关的结果共享。
浏览 2提问于2012-11-17得票数 4
回答已采纳
我想让用户能够选择他们预先输入的电子邮件，但是当我使用ng-options并且我尝试了ngFor，但它似乎仍然不起作用，我做错了吗？
transfer.component.html
<form (ngSubmit)="transFunds()" >
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<select [ng
浏览 26提问于2017-12-10得票数 0
回答已采纳
1回答
我正在尝试建立一个利用角2的visual解决方案。
以下是创建的3个TS文件：
inventory.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { InventoryComponent } from './inventory.component'
@NgModule({
imports: [BrowserModule],
declarat
浏览 0提问于2016-11-30得票数 0
回答已采纳
棱角2-互联网浏览器版本11没有显示我的应用程序。我需要做些什么才能让它展现出来吗？
目前，应用程序只显示一个空白屏幕，就像它没有加载应用程序一样。
我没有控制台错误。
它在chrome和firefox上运行得很好。
我用的是html5、打字本和angular2。
任何帮助都将不胜感激。谢谢。
这是我的代码：
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.2/es6-sham.min.js"></script>
<script src="https://
浏览 3提问于2016-02-01得票数 3
回答已采纳
我正在与AngularJS和.net核心一起工作。一般来说，我的想法是用角度显示数据，并从WebAPI内核调用.net。提供数据这不是一个问题，因为目前我没有完成的数据发布，因为我有问题，在显示表单，我应该张贴的地方。
app.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { BrowserModule } from '@angular/platform-browser';
imp
浏览 1提问于2017-07-21得票数 0
回答已采纳
我有一个使用angularJS http方法提交的表单。
代码：
<script>
// define angular module/app
var formApp = angular.module('formApp', []);
// create angular controller and pass in $scope and $http
function formController($scope, $http) {
// create a blank object to hold our form infor
浏览 2提问于2015-04-03得票数 0
回答已采纳
我试图在服务器上部署我的angular4应用程序，它在桌面浏览器和移动browser.Now中运行良好--我想从智能电视上浏览应用程序，但是它显示的是一个空白页而不是应用程序，在智能电视上浏览应用程序的实际问题是什么？如果我需要添加任何依赖项，特别是智能电视(WebOS浏览器)，请帮助我。
Rangecli.json项目：(. CLi -cli.json)
`{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"na
浏览 0提问于2017-08-07得票数 3
回答已采纳
我有一个在angular 7中的应用程序可以在其他浏览器中正常工作，但无法在IE11中加载 我还添加了source中的以下代码行，但仍然不适用于我。 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 我还搜索了更具体的错误原因，下面给出了我的依赖项。IE 11有什么变通方法吗？ "dependencies": {
"@angular/animations": "^7.0.0",
"@angular/cdk"
浏览 6提问于2019-10-10得票数 1
回答已采纳
1回答
我正在将一个巨大的angular 1项目从1.3.x升级到1.6.x，因为我们需要在最新版本中安装一些补丁。在更新之后，整个应用程序似乎都变慢了。我一直在看迁移文档，但是有没有什么东西可能会导致严重的速度减慢？有什么不好的代码或陷阱会导致这种情况吗？我只是遇到了视觉变化的问题，比如ng-show和ng-hide太慢了，太紧张了。
这是升级前的CPU配置文件：
这是升级后的CPU配置文件：
谢谢!
编辑：
让我给出更多的背景。我有一种感觉，这与消化周期有关。例如，我有一个导航栏，其中一个图标将隐藏，另一个图标将在悬停时显示.
下面是它在angular 1.3中的样子
下面是它在
浏览 0提问于2017-03-18得票数 7
4回答
我偶然发现了这个npm包，它根据我们的需求对数组进行分组。我需要在我的angular应用程序中使用这个包来分组我的数组。我应该如何将这些包导入到我的angular应用程序中。是否有其他模块存在于组数组中。https://www.npmjs.com/package/group-array#examples
浏览 28提问于2019-04-09得票数 1
我尝试在Internet Explorer11中运行由angular-cli 1.0.0构建的virgin Angular 4应用程序，但没有成功，并收到以下错误：
Error: The "apply" property of an undefined or null reference can not be retrieved.
我没有安装额外的库，它只是一个新生成的项目。在Google Chrome中，它运行得非常完美。我的package.json：
{
"name": "angi4testie",
"version": &#
浏览 1提问于2017-03-31得票数 25
回答已采纳
我们项目组的一位成员最近建议，由于Safari不兼容，我们从Angular 1/角材料转移到Angular 2/AngularMaterial2 2。我认为这种不兼容是一个材料设计柔性盒的问题，而不是一个角度问题，但我不想在没有研究的情况下进行反击。因此，我构建了Angular2 2/Bootstrap和Angular2 2/AngularMateri2应用程序，希望证明材料设计是问题所在，而迁移到Angular2则是一次大修，不值得接管。
但我很快意识到，我的Angular2 2/Bootstrap应用程序并没有在IE11/Safari中编译！想象一下我的惊喜！
我是否需要在Angular2
浏览 6提问于2017-04-26得票数 0
回答已采纳
如何在IE中运行angular 5应用程序而不使用这两个库。
import 'core-js/es6/reflect'
import 'core-js/es7/reflect'
我不能使用这两个模块，因为不安全的评估问题。但是没有这些，我就不能在IE上运行Angular代码。
浏览 14提问于2018-08-10得票数 0
我正在编写Angular 2通用应用程序，所以我不想要任何DOM类型。但是我想编译目录中的所有文件，所以在tsconfig.json中设置"file"是不可接受的。
浏览 0提问于2016-07-23得票数 5
回答已采纳
1回答
我创建了一个简单的计算器应用程序。我有两个组件:计算器和结果，它们之间使用角度路由器。现在我要这样做:当我在计算组件中执行计算时，结果将被传递并显示在另一个结果组件中。你能告诉我一些处理这个的方法吗？
calculator.component.ts
@Component({
selector: 'app-calculator',
templateUrl: './calculator.component.html',
styleUrls: ['./calculator.component.css']
})
export
浏览 1提问于2020-04-24得票数 0
回答已采纳
我试图访问我的服务的属性，我认为我将服务注入到我的类中的方式有问题。运行我的应用程序时，我会收到以下错误消息
angular.js:13424 ReferenceError:未定义CouponsService
在CouponsComponent.$onInit (coupons.controller.js:13)
..。
服务
angular.module('couponGeneratorApp')
.service('CouponsService', function () {
// AngularJS will instantiate a
浏览 4提问于2016-04-09得票数 1
回答已采纳
每当我按alt到autoformat我的代码，它格式化我的导入和数组从：
import { CommonModule } from '@angular/common';
let arr = [ myStringVar ]; // simple example, just go with it
至
import {CommonModule} from '@angular/common';
let arr = [myStringVar];
当自动格式化时，我如何告诉IntelliJ在开始大括号之后和关闭支撑之前放置一个空格？(特别适用于javascript、类型记录
浏览 1提问于2017-01-27得票数 18
回答已采纳
我试图在我的应用程序中使用angular-ui-router，但是导入它时有问题
Error: [$injector:modulerr] Failed to instantiate module uiRouter due to:
Error: [$injector:nomod] Module 'uiRouter' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the depe
浏览 1提问于2017-07-12得票数 0
我们使用的是AngularJS 1.6，并编写了以下提交表单的指令。
(function () {
"use strict";
function formSubmitDirective(cookieService) {
return {
require: "form",
link: function ($scope, $el) {
var csrf = cookieService.csrfTokenCookie();
浏览 1提问于2017-08-25得票数 0
我有一个问题：angular / material / datepicker。
我有一个虚拟项目，它可以正确地处理以下文件：
/src/app/app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserAnimat
浏览 1提问于2018-08-05得票数 1
1回答
我使用的是角度，我使用$resource向我的控制器提出了一个MVC的请求。我遇到了一个在IE11中不起作用的问题。工作在铬和火狐。
我有一个homeController.js，使用这个$scope，当它到达div时，它会被调用ng-init。
$scope.getUserShortcuts = function () {
$scope.shortcuts = usersService.getUserShortcuts(11);
}
这叫我的userService.js
(function () {
"
浏览 1提问于2015-03-19得票数 0
回答已采纳
我有一个现有的RoR应用，它使用angular 1.4.9。我想尝试ES-6的特性，我想使用ES6中的类来构建新的特性。是否可以使用定义新的类，这些类可以在现有的angular应用程序中使用，反之亦然。我知道您可以使用转译器(如babel)并将js添加到rails资产管道中。我的问题是如何在es6类和现有的angular应用程序代码之间导出/导入模块。
浏览 10提问于2016-07-20得票数 1
我正在尝试将我的Angular4应用程序更新为Angular5。
我试着遵循官方网站建议的程序，但是现在我不能再编译了，我得到了这个错误：
error TS5023:未知编译器选项“编译器选项”.
这是组件的版本：
Angular CLI: 1.6.8
Node: 7.4.0
OS: win32 x64
Angular: 5.0.0
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic
... platform-server
浏览 1提问于2018-02-14得票数 3
回答已采纳
我刚刚将我的应用程序从angular 6更新到angular 7，但是其中一些在angular 6中工作，而不是在angular 7中工作，它使浏览器处于无限加载状态。
例如：
@Component({
selector: 'app-page',
template: `<div *ngFor="let key of objectKeys(items)">{{key + ' : ' +
items[key]}}</div>`
})
export class MyComponent {
object
浏览 2提问于2019-02-27得票数 0
我试图运行这个规范，我得到了一个错误: SyntaxError:导入声明可能只出现在模块的顶层
但正如你所见，我把进口放在最上面，所以可能还有另一个原因？
ng-form-builder.spec.js
import angular from "angular";
import mocks from "angular-mocks";
import "src/ng-form-builder.js";
var inject = mocks.inject;
var module = mocks.module;
describe('ng-fo
浏览 4提问于2016-04-28得票数 0
回答已采纳
6回答
把underscore.js变量附加到角变量可以吗？所以我可以把下划线叫做：angular._？既然下划线不太可能在测试中被嘲笑，而且我们不能声明全局变量？
如果是这样的话，我应该添加angular.js应用程序的哪一部分？
浏览 6提问于2015-07-09得票数 6
回答已采纳
13回答
当我生成一个带有角CLI (8.0.0)的项目时，我运行ng serve，在Internet中打开应用程序，然后出现一个空白屏幕。
我查看了polyfills.ts文件，并取消了以下行的注释：
import 'classlist.js';
import 'web-animations-js';
我还删除了所有core.js导入，因为Range8直接支持core.js 3.0。
我还运行过npm i。
package.json：
"dependencies": {
"@angular/animations":
浏览 1提问于2019-05-30得票数 86
回答已采纳
我正在致力于将一个大型AngularJS应用程序升级到Angular 5+。这意味着在混合AngularJS应用程序中使用新的Angular 5组件。在许多情况下，表单嵌套在其他表单中。旧的AngularJS代码的父表单如下所示： export default function PersonDirective() {
return {
restrict: "E",
template: `
<div ng-form="personForm">
<
浏览 31提问于2020-04-23得票数 3
我开发了一个Angular 2应用程序，它不能在Android4.1.x和更多的普通浏览器上运行。
我的应用程序中包含的唯一多边形填充链接如下所示：
<script src="node_modules/core-js/client/shim.min.js"></script>
我阅读了Angular2文档()，我发现我必须加入ES6 Polyfill才能在安卓设备上工作，但我不知道如何链接它。它包含在core-js模块中，但是如何将它插入到应用程序中呢？
浏览 25提问于2017-02-09得票数 2
这是一个角形2最终版本的应用程序与Visual 2015。gulp用于从节点模块生成库。
我的应用程序在chrome和Edge中运行良好，但在Firefox和IE中不工作
*
火狐错误：
*
Error: (SystemJS) missing = in const declaration
@http://localhost:50135/scripts/app.module.js:13:25
@http://localhost:50135/scripts/app.module.js:1:31
@http://localhost:50135/sc
浏览 7提问于2016-09-29得票数 1
回答已采纳
我正在尝试键入和保存输入字段中的数据。由于某些原因，我不能在字段中键入一旦我呈现模态。
这是我的密码：
constructor(props){
super(props);
this.state = {
showHide : false,
email: ' '
}
}
handleChange = (e) => {
this.setState({
[e.target.email]: e.target.value
浏览 3提问于2020-04-10得票数 0
回答已采纳
我创建了一个简单的Angular4应用程序，并将其打包为Tizen web应用程序。这个应用程序可以在我测试的所有主要浏览器(Safari、Chrome和Firefox)上运行，但会呈现一个带有空()元素的空页面。
在调试模式下运行Tizen应用程序时，控制台上未显示Javascript错误。此外，在Angular4包含的文件之后，Javascript警报运行得很好。
我注意到的另一件事是Tizen花了大约10分钟来编译Angular (vendor.js为240kb)生成的javascript代码。
浏览 1提问于2017-09-08得票数 3
我有一个ComponentB在一个角2应用程序(beta 1)。它的工作非常好，直到我将它放在ComponentA中的一个ComponentA循环中。我收到了一个相当神秘的错误：
例外: angular2.dev.js:22690BrowserDomAdapter.logGroup @ angular2.dev.js:22701ExceptionHandler.call @angular2.dev.js:1163(匿名函数)@ angular2.dev.js:12416NgZone._notifyOnError @ angular2.dev.js:13324collection_1.Stri
浏览 7提问于2016-01-17得票数 5
回答已采纳
我按照这个stackoverflow answer 中的步骤使用aws sdk将文件上传到s3 bucket，但是，在tsconfig.app.json中对类型进行更改后，angular应用程序在IE中不能工作。有人能帮上忙吗？
浏览 7提问于2018-10-18得票数 0
1回答
是否可以迁移angular1.6和angular5。
我的问题是：
不改变角1.6码和新角5码同时运行？
如何为此定义代码结构？
如何咕哝这些angular1.6和angular5代码？
所需经费：
因为我需要独立运行应用程序angular1.6和angular5。
请举一些例子来解决这个问题。
浏览 0提问于2018-01-20得票数 0
在Angular2应用程序中，只有在满足几个条件时，提交按钮才会启用。我使用[disabled]="disabled(j)"实现这一点。
html：
<button type="submit" class="submit" [disabled]="disabled(j)">Submit</button>
组件：
disabled(j) {
if (this.form.valid && j === this.userId) {
return false;
} else {
浏览 23提问于2018-08-01得票数 0
当我尝试运行我的单元测试时，我得到以下输出
$ npm test
> @ test C:\workspace\project
> mocha -r ./testhook.ts app/**/*.spec.ts
C:\workspace\project\app\common\product\price.model.ts:92
export class Price extends AbstractPrice {
^
ReferenceError: __extends is not defined
testhook.ts包含：
require('ts-node').
浏览 2提问于2018-03-02得票数 1
我在我的应用程序中使用 (我使用Angular-5)。它在Chrome和Firefox上运行完美。但在IE 11中，下一个和上一个按钮单击事件不起作用(抛出控制台错误)。
请建议一些解决方案。谢谢！
浏览 1提问于2018-09-18得票数 0
3回答
我用Yeoman的yo angular启动了一个包含Karma测试的Angular.js应用程序。然后，grunt test合理地失败了，因为。(尚未在应用程序的node_ browsers /karma配置文件中设置模块。)
我正在通过SSH在一台远程机器上进行开发，我认为(如果我错了请告诉我)安装Chrome、/usr/bin/chromium-browser是毫无意义的。
那么有没有可能在没有任何浏览器的情况下运行Karma呢？
浏览 1提问于2014-02-20得票数 34
回答已采纳
1回答
我已经建立了一个基本的角度2(打字稿)应用程序，使用Webpack 2进行捆绑等。
我的问题是，当我使用ts加载程序处理类型记录(.ts)文件时，我会得到很多错误。我怀疑，但不完全确定，这些错误是由于ts-loader 而不是排除了node_modules目录，尽管我指定它在webpack配置中排除它。
我只想能够设置我的webpack配置(和我的应用)，以便打字稿可以被转换和应用程序可以正确地捆绑webpack。请帮帮忙。
Webpack.config.js
var webpack = require('webpack');
module.exports = {
e
浏览 3提问于2017-03-28得票数 0
回答已采纳
我希望在我的resolve应用程序的路由中使用AngularJS从AngularJS API中检索数据，并将其设置在$scope上。
我尝试了以下几种方法，但都没有效果--没有设置$scope.forms：
angular.module('mycompany.resources').factory('Forms', ['$http', function($http) {
var Forms = {};
Forms.all = function() {
return $http.get('/api/form
浏览 1提问于2014-02-28得票数 1
回答已采纳
我已经开始学习Angular 4，并使用Angular CLI (NG New HelloWorld)编写了一个默认应用程序。当我编写ng serve并浏览到http://localhost:4200/时，页面在Chrome中加载得很好，但是在IE-Edge中，它作为一个空页面打开。IE的控制台窗口出现了错误，即SCRIPT5022: Exception thrown and not caught File: polyfills.bundle.js, Line: 859, Column: 36。这是意料之中吗？
Screenshot of Empty Page in Internet Expl
浏览 5提问于2017-10-10得票数 17
回答已采纳
1回答
我目前正在开发一个使用Angular2/ES6在Chrome上工作的应用程序。
然而，客户希望在IE上运行相同的应用程序。我知道IE不支持ES6。我只是想知道，是否有同样的方法可以实现。
附言-我正在从我的Visual Studio2015进行构建，下面是我的tsconfig.json。
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"moduleResolution": "node",
"sour
浏览 0提问于2017-03-23得票数 1
我使用的是Angular 5，并且我使用了以下代码来实现自动提示功能，从API获取建议值
HTML代码：
<div class="col col-lg-4">
<label for="insuranceCompanyName"> Insurance Company Name </label>
<input appDisablePaste list="companyLists" class="form-control input-sm" nam
浏览 0提问于2019-11-12得票数 1
我们在项目中使用AngularJS 1.6和bootstrap 4.3.1来构建UI。现在，我想构建一个简单的组件，它基本上使使用bootstrap的表单组元素变得更容易。
我试着像这样写组件：
模板：
<div class="form-group">
<label
for="input-{{::$ctrl.name}}"
class="input-label mb-1"
ng-class="{'disabled': $ctrl.isDisabled, 'required&
浏览 0提问于2019-09-30得票数 0
我正在做一个使用Angular 9的应用程序。这个应用程序基于一个mat-table来显示数据，但它的数据是由一些字段过滤的，类似这样： ? 问题是下拉菜单显示重复的值(这是正常的，因为例如一个国家可以在某些行中重复)，并且显示的数据是基于mat-table dataSource.filteredData的，所以我不能执行new Set()或类似的操作。我在问自己如何更改/修改我的代码，以便在下拉列表中只显示唯一的值。 我的代码类似于： <mat-form-field appearance="fill">
<mat-label>Sele
浏览 21提问于2020-10-20得票数 0
回答已采纳
我想向我的ModelAdmin的列表显示中添加一个表单，但是无法正确地呈现csrf_token。我用的是django 1.6我的代码如下所示：
class ApplicationAdmin(admin.ModelAdmin):
model = Application
list_display = ('applicant', 'approve_or_reject')
def approve_or_reject(self, obj):
return '<form method="post" ac
浏览 3提问于2016-02-08得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
