angularjs组件控制器未将初始绑定值传递给模板中的指令(summernote)
AngularJS是一种流行的前端开发框架，它使用组件化的方式构建Web应用程序。在AngularJS中，组件控制器负责处理数据和逻辑，并将数据传递给模板中的指令。
在给定的情况下，如果AngularJS组件控制器未将初始绑定值传递给模板中的指令（summernote），可能有以下几个原因：
- 绑定值未正确设置：确保在组件控制器中正确设置了初始绑定值。可以通过在组件控制器中定义一个变量，并将其绑定到指令的属性上来实现。
- 绑定值未正确传递：确保在模板中正确传递了组件控制器的绑定值给指令。可以通过在模板中使用指令的属性，并将其绑定到组件控制器的变量上来实现。
- 指令未正确接收绑定值：确保指令（summernote）正确定义了接收绑定值的属性，并在内部使用该属性来展示数据。可以通过在指令的定义中使用
scope属性来实现。
总结起来，解决该问题的关键是确保正确设置和传递组件控制器的初始绑定值，并确保指令能够正确接收和展示这些值。
腾讯云提供了一系列与前端开发相关的产品和服务，包括云服务器、云存储、云数据库等。您可以通过访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。
相关·内容
2回答
我创建了一个简单的AngularJS组件，它的参数是标题，如下所示：
(function () {
'use strict';
function myHeader() {
return {
restrict: 'E',
scope: {
pageTitle: '@'
},
template: '<div class="crumby-t
浏览 0提问于2017-10-18得票数 1
我是Angularjs的新手，我有一个应用程序，有一些“项目”，其中有一个本地菜单显示在一些页面上。Index.html包含带页脚的主导航条：
<body ng-app="ysi-app" ng-controller="MainController">
<div class="page-content">
<div class="row">
<div class="col-md-2">
<div class="sidebar co
浏览 0提问于2016-11-13得票数 1
回答已采纳
1回答
我正在尝试制作一个泛型组件来显示变量，或者从它的作用域调用方法。
编写<component config-name></component>感觉很自然，所以我坚持用属性指令中的变量填充泛型组件的作用域。
该指令将提供要显示的变量、调用方法等。
最后我得到了这样的结果：
var app = angular.module('app', []);
app.component('component', {
template: '<li>{{data}}</li>'
});
app.directive
浏览 2提问于2017-08-30得票数 0
回答已采纳
我想制作一个等式标签，并使用label属性来查找要使用的等式。为此，我有以下应用程序：
(function(){
var app = angular.module('mathDocument', []);
app.directive('equation', function(){
return {
restrict: 'E',
scope: {
label: '@label'},
templa
浏览 0提问于2015-01-20得票数 0
回答已采纳
1回答
我想创建一个"summernote“指令(wysiwyg编辑器)。
这是模板：
<summernote active="false">
<button class="edit" ng-click="edit()">Edit</button>
<button class="save" ng-click="saveData()">Save</button>
<button class="cancel" ng
浏览 0提问于2014-06-09得票数 0
回答已采纳
当您在Javascript中创建AngularJS组件，并使用ui-bootstrap将其显示为模态时，您将传递一个绑定，模态实例可以使用该绑定来解除或关闭自身，如下所示：
app.component("fringeEdit", {
controller: "FringeEditController",
templateUrl: "/template/fringeEditTemplate.html",
bindings: {
close: '&', <---
浏览 0提问于2019-12-29得票数 0
1回答
我已经尝试创建一个与进度条相对应的AngularJS组件。下面是为这个问题创建的JSFiddle，
下面是我的应用程序和组件定义：
var myApp = angular.module('myApp',[]);
myApp.controller('TestController', function($scope) {
$scope.total = 20;
$scope.count = 15;
$scope.changeTotal = function(value){$scope.total += value};
$scope.
浏览 1提问于2016-07-11得票数 0
回答已采纳
1回答
我有一个可以编辑的表格。当用户单击一个按钮时，我试图设置Summernote插件。
例如，这是表单头，它应该在编辑为真时得到之和初始化，当编辑为false时被销毁。
<div class="card-header" toggleSummerNote>
<h2>{{questionnaire.description.title}}</h2>
</div>
如何使summernote指令具有条件性？我试过这个指令，但不起作用。有什么建议吗？
app.directive('toggleSummerNote', fun
浏览 1提问于2016-02-11得票数 1
回答已采纳
假设一个自定义指令：
定义扩展或替换的自定义标记或属性。
可以包括控制器逻辑，如果需要的话
指令可以是类型元素
<my-customdirective></my-customdirective>
或类型属性
<h4 my-customdirective></h4>
我的问题是什么时候和为什么我决定使用一种而不是另一种？
浏览 5提问于2014-08-07得票数 2
回答已采纳
1回答
我正在学习angularjs，对于自定义控件的可重用性，我感到有点困扰。我有一个自定义控件，我想在以下场景中重用该控件：
场景1：自定义控件有一个带有作用域变量的控制器，我希望在另一个控制器中使用这些变量。在这种情况下，我的自定义控件控制器将是子控制器，并且我将通过以下方法访问我的父控制器作用域值：
$scope.$parent.property = value;
场景2：自定义控件需要在页面上单独呈现，现在是父控制器。在这里，我将使用默认的$scope语法访问范围：
$scope.property = value;
我想在这两个场景中重用控制/控制器。自定义控件需要能够访问$scope，并且
浏览 3提问于2015-04-26得票数 0
回答已采纳
我一直在使用AngularJS中的指令，它使用从控制器的$scope中获取的数据构建了一个HTML。当控制器从服务器获取JSON数据时，我的控制器设置了一个$scope.ready=true变量。这样，指令就不必在每次获取数据时一次又一次构建页面。
以下是发生的事件的顺序：
控制器页加载一个路由并触发控制器函数。
页面扫描指令，并触发这个特定的指令。
该指令构建元素并计算其表达式并向前推进，但当触发指令链接函数时，它将等待控制器“就绪”。
准备就绪后，会触发一个内部函数，然后继续构建该部分。
这是可行的，但代码是混乱的。我的问题是，有没有更简单的方法来做这件事？我可以抽
浏览 1提问于2012-08-12得票数 1
回答已采纳
1回答
我有一个名为直方图演示的组件，其中有一个单独的控制器，它有一个名为$scope.selectedElements的变量，我想在主appCtrl控制器中查看这个变量。如果没有$rootScope，我如何能够访问这个变量。
主HTML
<html lang="en-US" ng-app="histogram-test" ng-controller="appCtrl">
<div class="histogram-container"> <histogram-demo options = "o
浏览 1提问于2017-06-29得票数 1
回答已采纳
我已经将我的一个用户数据输入表单转换为uib模式，但是当我试图从“取消”按钮关闭该模式时，我会得到以下错误：this.$modalInstance.dismiss is not a function.。同样的事情是如果使用this.modalInstance.close().，这是很奇怪的，因为TypeScript似乎认为这些方法应该存在于VS代码中的代码完成基础上。
无论如何，基本设置如下：
打开模态的控制器：
class TestModalController {
static $inject = ['$modal'];
options: ng.ui.bo
浏览 10提问于2019-12-28得票数 0
回答已采纳
2回答
我计划创建一个文本编辑器，用户可以使用AngularJS指令构建自己的html页面。我已经了解了summernote模板插件()，它对普通的html非常有用，但是没有正确地插入包含给定参数的AngularJS指令。
下面是一个演示这个问题的小型柱塞项目。我使用了原始的和angularjs包装的夏季笔记，你可以看到不同的行为。我的目标是能够插入“模板1”以显示给定的数据(StringData和ObjectValue)。
Index.html -通用角度语法，以及指令
<div id="summernote">
<h3>Using jQue
浏览 1提问于2016-10-20得票数 2
回答已采纳
我是在一个项目中，我们想要组件化许多“信息框”。
这些框(假设它们主要是不同类型的表)应该很容易地包含到不同的页面中，甚至是不同的项目中(我们将组件作为一个库包含到一个角js项目中，因此角js是一个需求)。从长远来看，这些组件甚至可以作为其他开发人员使用的API。
到目前为止，这些指令包括自己的模板、公共css样式+组件的唯一样式、一组testdata文件。
所以我的问题基本上是:这能成为一个好办法吗？让指令本身实际加载数据是错误的，还是应该始终将数据传递给它们？
我希望指令自己加载数据的原因是，我在库中包含了testdata，允许在不需要实现“真实”数据的情况下测试适当的组件(例如仪表板
浏览 0提问于2014-12-17得票数 3
回答已采纳
我有下面的例子。
HTML：
<body ng-controller="MainCtrl as MgtCtrl">
<p>Hello {{MgtCtrl.name}}!</p>
<p>Result is {{MgtCtrl.result}}!</p>
<output-content data="MgtCtrl.name" result="MgtCtrl.result"></output-content>
</body>
Java
浏览 6提问于2015-05-26得票数 0
回答已采纳
2回答
我在我的主布局文件中有这个
<body>
<header id="header" ng-controller="HeaderController"></header>
<div class="container" ng-view></div>
我的目录结构中有一个header.html分部模板。
如何在我的应用程序中包含此模板？我认为angular在处理控制器后会自动包含模板，但它不起作用。
header节点应替换为该文件的内容。
浏览 1提问于2014-03-11得票数 58
回答已采纳
我在角2中创建了一个指令，它正在初始化summernote文本编辑器，它工作得很好，但是我无法得到它的值--它总是在ngModel中返回未定义的
指令代码:
import { Directive, ElementRef, Input, Output, EventEmitter } from '@angular/core';
declare var $: any;
@Directive({ selector: '[summernote]' })
export class summernoteDirective {
@Input() config;
浏览 7提问于2017-08-23得票数 0
我有一个按钮(一个a标签)，它出现在我的网站上的许多地方。它被称为"View“，在某些情况下，它只是调用一个ui-sref来导航到一个演示页面：
<a class="btn btn-primary" ui-sref="hamburger-push" target="_blank">
View Demo
</a>
这样做很简单，除非在某些情况下它将ng单击绑定到宿主页面的控制器上：
<a class="btn btn-primary" ng-click="mod.modals.ba
浏览 1提问于2017-05-02得票数 0
回答已采纳
我在angularJS中使用summernote。问题是，当我在summernote编辑器中打开下拉列表时，没有选择任何选项，而在页面中的其他地方我仍然可以看到下拉列表。我希望在编辑器外部单击时隐藏下拉菜单。我该如何实现这一点？
我的html代码是。
<summernote id="summernoteId" config="options" ng-model="x.responseTitle" placeholder="Enter title"/>
浏览 0提问于2018-04-12得票数 0
是否应该在AngularJS中使用指令来实现小部件或控制器/服务？当谈到小部件时，我想到的是一个UI控件，你可以从一个控制器中与之交互，例如对话框，树，网格，图表。
例如，如果我要创建一个dialog小部件，我希望在小部件上调用show()函数来显示对话框。使用指令这似乎是不可能的。我见过在根作用域上使用了一个变量，例如'showDialog'，该指令监视它来解决这个问题。在中，它们使用服务来实现对话框。
浏览 0提问于2013-05-30得票数 2
回答已采纳
我的目标是用UpgradeModule升级一个大型的AngularJS应用程序，这样我就可以同时运行AngularJS和Angular 6，而不需要做准备阶段，这会告诉你遵循AngularJS风格指南。
我想知道，当你有很多类似于这个的控制器时，是否有可能：
angular.module("MyModule").controller($scope, function ($scope) {
// code here.
};
我的问题是:只有当你有AngularJS组件时，UpgradeModule才能工作吗？到目前为止，我已经编写的控制器还没有成功。我可以在这里看到一
浏览 1提问于2018-08-10得票数 1
1回答
这是我的场景
意见：
<div data-ng-controller="MyModuleController">
<div ng-repeat="a in range() track by $index" >
<ty-project idx="$index+1" ng-model="projects[$index]" ></ty-project>
</div>
</div>
主计长：
$scope.projects= [];
$sco
浏览 3提问于2014-12-17得票数 0
回答已采纳
如何使用表达式绑定通过两个具有独立作用域的指令传递函数？
在父子关系中，我有两个指令：
app.directive('parentDir', function(){
return {
scope:{
parentData:'=',
changeRouteParent:'&'
},
templateUrl:'mydir/parentTemplate.html'
};
});
app.directive('
浏览 1提问于2014-02-14得票数 2
2回答
我得到了一个错误：
错误:错误：$injector/unpr?p0=HttpResponseProvider%20%3C-%20HttpResponse%20%3C-%20DealerLeads
注入器未知提供者
这是我的路由器(ui.router)：
$stateProvider
.state('main', {
url: "/main",
templateUrl: "views/main.html",
data: { pageTitle: '
浏览 2提问于2015-01-29得票数 2
回答已采纳
有没有一种方法可以捕捉滚动页面的事件，在控制器中吗？我在组件的控制器$onInit上有这个：
$scope.$on('scroll', function() {
console.log('Something something');
});
我只看到了如何在指令上使用.bind()来实现这一点，如：
我一直在潜藏官方指南，却什么也没发现。
浏览 7提问于2018-01-02得票数 0
好吧这是个人为的例子但是..。
假设我有这样一个控制器：
app.controller('TestCtrl', function() {
this.testString;
this.otherString;
});
我有一个这样的模板：
<div ng-controller='TestCtrl as test'>
<input demo type='text' ng-model='test.testString'>
{{test.otherString}}
</div&
浏览 1提问于2014-11-12得票数 2
回答已采纳
进一步解释，
我使用的是角求和笔记，我使用一个指令在DOM中插入新的WYSIWYG编辑器实例。但是，当我将其插入DOM中时，新的编辑器不会加载，这可能是因为init已经被触发。
下面是我使用的指令，以及工作的jsFiddle，它确实插入了编辑器标记，但是没有生成/启动另一个编辑器：
angular.module('summernoteDemo', ['summernote'])
.directive('addSummernote', function () {
return function (scope, element, at
浏览 0提问于2014-09-01得票数 3
回答已采纳
我是Javascript和AnuglarJS的新手，但我有一些Java经验。我正在学习AngularJS ，我有一个问题。
在“创建包装其他元素的指令”一节中，有一个。在示例/演示中：
指令myDialog的模板如下所示：
<div class="alert">
<a href class="close" ng-click="close({message: 'closing for now'})">×</a>
<div ng-transclude><
浏览 1提问于2017-10-02得票数 0
回答已采纳
1回答
我尝试创建具有以下功能的待办事项列表：
可排序项目
每个项目中的WYSIWYG编辑器
待办事项模型中项目编辑器存储的每次更改
我做了1和2，但不能做3。我只能在任务数组中更改第一个任务的标题
这是我的密码
app.js
Vue.directive('summernote', {
bind: function() {
this.editor = $(this.el).summernote({
airMode: true,
disableDragAndDrop: true,
popover: {
a
浏览 4提问于2016-09-20得票数 5
回答已采纳
我使用的是AngularJS和打字本。有一个外部库正在使用，我需要从这个库中调用一个AngularJS方法，该方法以香草javascript表示，我遵循了。
但令人遗憾的是，它并没有奏效。
我得到的错误是这个函数(在我的AngularJS类中)不是一个函数。
var scope = angular.element(
document.
getElementById("MainWrap")).
scope();
scope.$apply(function () {
scope.createSession(data);
});
这与我在打字稿中使用的vm有关吗？
以下是
浏览 2提问于2016-02-08得票数 0
回答已采纳
我没有成功地创建一个属性指令，它在子元素中使用vm，并使用指令控制器作用域，而不是它的父作用域。
请参阅：
如何使第二条消息显示来自指令控制器的消息？
浏览 2提问于2016-09-17得票数 0
我需要创建html模板，并将相应的控制器动态绑定到它。
我怎样才能用AngularJS做到这一点呢？
我可以使用$compile服务创建动态模板，但我不知道如何以一种高效而优雅的方式将控制器绑定到它。
详细信息。
我想创建一个弹出式菜单。我用onPopupShowEventHandler(event, data)方法做了一个服务。此方法将创建一段简单的具有某些行为的html代码，并将其插入到我的主要html代码的主体中。我从外面得到的行为。而这种确切的行为取决于情况。
所以，现在我可以用$compile服务创建一段html代码了，但是我想把一个控制器放到这段html代码的ng-controll
浏览 3提问于2014-03-03得票数 2
1回答
我正在学习AngularJS中的指令，我看到了以下代码：
var app = angular.module('app', []);
//creating custom directive syntax
app.directive("myDir", function () {
return {
restrict: "E", //define directive type like E = element, A = attribute, C =
class, M = comment
scope: { /
浏览 1提问于2015-04-07得票数 0
回答已采纳
我正在努力跟上1.5个角度组件的速度。我一直在关注todd Motto的视频，以开始了解组件以及angular的文档。
在这一点上，组件似乎正在取代使用控制器的指令，但在我们的1.5代码中，我们仍然会使用指令来进行dom操作。
在组件控制器中使用$element、$attrs的目的是什么？这些似乎是可以操纵的。这是指向文档中柱塞的链接。我知道他们没有使用$element，但这是我正在阅读的示例。
但在像这样的代码中...
angular
.module('app', [])
.component('parentComponent', {
tra
浏览 37提问于2016-02-18得票数 26
回答已采纳
我的控制器在我的AngularJS 1.5代码中加载了多次：
<div ng-repeat="conditionForMultipleRows">
<div data-ng-if="$first">
<div co-my-component></div>
</div>
</div>
export function coMyComponent(): ng.IDirective {
return {
template: coMyComponentTemplateHtml,
浏览 5提问于2022-07-20得票数 2
如何使用Angular 5绑定来自summernote输入的数据？
component.html
<textarea class="form-control" ngModel
name="description"
id="summernote"
[(ngModel)]="learningunit.description"
maxlength="10000" rows="50"></textarea>
co
浏览 0提问于2018-05-27得票数 0
1回答
我试图用来自服务的数据更新指令的内容。它的工作方式如下：
服务(html5画布服务) ->在控制器中调用某个动作的方法。
控制器在被服务调用的方法中更新$scope.directiveData。
指令(作用域: true)应根据新数据更新其内容。
问题是指令不更新其内容。但是，当我在控制器中向directiveData添加定期更新时：
$interval(function() {$scope.directiveData.abc;}, 100);
指令更新其内容！
对这种行为有什么解释吗？我怎样才能摆脱这个定期更新呢？
我在jsFiddle：中模拟了这个问题
浏览 0提问于2016-12-27得票数 0
1回答
我试图对我的输入元素实现过滤。我想用type="text“字段对输入进行过滤。例如，如果模型包含的字符多于我想要更改的输入值。我已经创建了，我有动态生成html模板的指令，它包含输入字段。
var app = angular.module('app', [])
.controller('ctrlr', function($scope){
$scope.myModel = "test";
$scope.availableCharacters = 5;
$scope.$watch('myModel',
浏览 1提问于2015-04-14得票数 2
回答已采纳
是否可以像OOP那样在AngularJS中实例化一个控制器并将参数传递给它的构造函数？我不知道如何用变量名称和内容来重构3个相同的控制器，这些变量会发生变化……
谢谢。
浏览 1提问于2013-12-10得票数 3
我有一个类似这样的组件：
(更新并使用解决方案:)谢谢)
my-component.js声明
(function() {
'use strict';
angular
.module('app')
.component("myComponent", {
bindings: { obj: "=" },
controller: "ComponentController",
controllerAs: "vm",
template:
浏览 4提问于2016-05-25得票数 4
回答已采纳
在我目前的公司，我们正在开发一个非常大的angular应用程序。争论的焦点之一就是找出在控制器之间共享非单例状态的最佳方式。在理想的场景中，控制器共享一个恰好是单例的状态，我们可以将该状态建模为service，并使用此service通过inject在这些controllers之间进行通信。
但是我们想要这个层次结构的多个实例，这意味着拥有一个单例是没有帮助的。我们需要的是一个基于上下文的单例，它也可以是可注入的。
我们目前正计划通过指令层次结构来实现这一点，在指令层次结构中，最上面的指令的控制器管理状态，然后所有较低的指令管理这个控制器(指令控制器require指令到指令的通信！)并在其上调用
浏览 1提问于2014-09-04得票数 0
我试图在角1.5中使用新的.component()方法。目前，我发现很少有关于如何使用它的信息。棱角分明的医生也不提这个问题。
我试图将作用域或对象从作用域传递给.component，以便在组件的模板部分中使用，但我只能传递的两个参数是$element和$attrs。我尝试通过html中的一个属性传递对象，但是我得到的只是对象名称的字符串。
我尝试将其设置为以下列方式表示为变量
my-attr="item.myVal"
my-attr="{item.myVal}"
my-attr="{{item.myVal}}"
每次我仍然得到字符串文本，而不是
浏览 0提问于2016-01-12得票数 13
在我的第一个实验中，我的angulerJS模板中有以下内容：
LoremIpsum: {{myObj.a}}
这个很管用。显示myObj.a的值，因为在我的控制器(myController)中，我设置了$skope.myObj = <something with attribute a>
但是接下来的实验中，我希望有一个元素指令，它可以查看值myObj.A并根据该值显示不同的内容。这个决定的逻辑相当复杂，所以我想把它放在指令中，而不是模板中。
下面是我的新模板：
LoremIpsum: <a-directive a="myObj.a">
下面是我当前的指
浏览 3提问于2016-01-10得票数 1
4回答
从父作用域数组中删除项
、、、、
在用户单击“删除”按钮后，我试图从我的控制器中定义的json数组中删除一个项。该按钮驻留在指令的html模板中。
这是我的控制器
listVMS.controller('vmInfoController', ['$scope', function($scope) {
var json = [{
image: 'img/fedora.png',
status: 'running',
name: 'Fedora',
浏览 12提问于2016-01-08得票数 0
回答已采纳
我正在尝试将变量传递给指令。
app.directive('pagination',function () {
//custom directive for build pagination
return {
restrict: 'E'
template:function (elem,attr)
//not getting the value
console.log(attr.pageCount);
}
};
})
在我的html中
<
浏览 4提问于2017-10-11得票数 0
3回答
我是AngularJS的新手，在浏览许多站点的时候，我现在可以创建一个指令来显示一些data.Now，我需要通过单击按钮将一些数据发送给控制器。我需要知道正确的方法
我创建了
html
<!DOCTYPE html>
<html ng-app="app">
<head>
<script data-require="jquery@*" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/
浏览 4提问于2016-06-06得票数 1
回答已采纳
我正在创建一个非常简单的自定义指令，并试图通过使用'<‘符号将一个简单的字符串变量从父作用域传递到自定义指令隔离作用域。然后，我尝试在自定义指令控制器中为变量分配一个新值，并在模板中显示新值，但它仍然显示旧值。
这是我的父控制器：
(function(){
angular.module("app").controller("ctrl", ctrl);
function ctrl(){
ctrl = this;
ctrl.fullname = "Paul G.";
浏览 1提问于2017-11-17得票数 0
我希望多次重用一个包含了表达式的模板，并有选择地将其绑定到作用域的不同属性，如下所示：
<div ng-show="isCoApplicant" bind-to="applicant in data.coApplicant">
<% include ../row-templates/applicant-row %>
</div>
类似于ng-重复的行为，它为该行创建子作用域，并根据表达式“data.coApplicant”在该行上设置属性，行输入可以通过ng-模型绑定到“申请者”。
我花了一些时间研究各种角度指令，包括
浏览 4提问于2015-04-23得票数 1
回答已采纳
我有一个带有父控制器的父视图，有两个子组件，每个子组件都有自己的控制器。
就像这样
<section> // Main Controller
<table-users listusers="users"></table-users> // Component Table User Controller
<table-news listusers="users"></table-news> // Component Table News Controller
</
浏览 1提问于2016-06-27得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
