我在ng-click上调用一个函数,该函数应该使用JSON数据中的值更新html.
我不知道这应该如何工作或我在这里做错了什么？
我的代码看起来像这样:
<table class="table table-striped table-bordered">
<thead class="head">
<th>Product</th>
<th>Description</th>
<th>Price(Rs.)</th>
<th>Add to Cart</th>
</thead>
<tr ng-repeat="row in rows | filter:search | orderBy:'product'" >
<td>{{row.product}}</td>
<td>{{row.description}}</td>
<td>{{row.price}}</td>
<td><a ng-click="addToCart(price)">Add to cart</a></td>
</tr>
</table>
下面是我的垃圾箱 http://jsbin.com/UBIwOsE/2/
有人可以帮我告诉我如何用红色边框更新div.我需要在点击添加到购物车时更新它的书名和价格.
谢谢
是否有一种简单的方法来定位范围内的元素并更改类名称或样式.
我曾经使用过Jquery,只是使用.parent().find来定位相对元素,但找不到一个简单的解决方案来完成一个非常简单的任务.
大多数解决方案似乎都非常复杂,我确信angular可以消除对大量代码的需求.
我想要相对于ng-click元素或从作用域的根目标,并应用新的类名.
这是一个非常基本的场景,我需要按钮来改变H1的类.
<div>
<h1 class="Blue">Welcome</h1>
<ul>
<li>
<button ng-click="myFunction()">Change H1 to Red</button>
</li>
</ul>
</div>
任何意见,将不胜感激.
我已经阅读了有关此内容的所有帖子,但不幸的是,它们都没有帮助:jsfiddle和plunker链接似乎不再有效.
我要做的是简单地在bootstrap pop-over中放入一个按钮,该按钮调用我创建的指令范围内的函数.问题是使用jquery来抓取内容它不起作用,因为范围似乎在外面.同时尝试在函数内部创建内容也无法正常工作,因为它不会被编译.
我在jsfiddle上创建了一个例子,但不知何故,angularjs没有加载到正确的位置,因此它也不起作用.
$("#pop-over-link").popover({
'placement': 'top',
'trigger': 'click',
'html': true,
'container': 'body',
'content': function() {
return $("#pop-over-content").html();
}
});
这是打开弹出窗口的代码片段,抓取内容并显示它.
这里是jsfiddle:http://jsfiddle.net/75zLT/2/
以下是我的保管箱上的工作示例:https: //dl.dropboxusercontent.com/u/19470623/hatethis/test.html
javascript jquery twitter-bootstrap angularjs angularjs-ng-click
我无法想办法如何做这样的事情:
<a href="http://google.com" ng-click="myFunc(this.href)">Link</a>
所以基本上我想传递点击链接的href作为参数 myFunc
使用ng-click时遇到麻烦.我在按钮上添加了ng-click指令.它不会触发与ng-click相关的功能.在Angular Batarang工具中,它表示函数未定义.
我在Plunker中尝试了这个问题.它确实有效.而且如果我硬编码文件路径它的工作原理.
index.html代码
<!DOCTYPE html>
<HTML ng-app="myEventApp">
<head>
<meta charset="UTF-8">
</head>
<body>
<h1 ng-controller="HelloWorldController">{{ helloMessage }}</h1>
<div ng-controller="EventDetail">
</div>
<div ng-include="" src="fileName"></div>
<!--<ng-include src="fileName"></ng-include>-->
<!--<div ng-include="" src="'template/testing10000.html'"></div>-->
<button ng-click=incrementCounter()>Next</button>
<button ng-click=decrementCounter()>Back</button>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
<script src="js/app.js"> </script>
</body>
</HTML>
app.js代码
var app = angular.module("myEventApp", []);
app.controller('HelloWorldController', ['$scope', function($scope){
$scope.helloMessage = "Book Viewer";
}]);
app.controller('EventDetail', ['$scope', function($scope){
$scope.counter = 0;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
$scope.incrementCounter = function(){
$scope.counter++;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
}
$scope.decrementCounter = function(){
$scope.counter--;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
} …javascript angularjs angularjs-ng-include angularjs-ng-click
这是我的 ts 组件中的一个简单的 jquery 函数
open_user(user) {
$(user).css("visibility", "visible");
$(user).css("opacity", "1");
}
这是我在 html 中的调用方式
<div class="user" *ngFor="let user of arrUsers" ng-click="open_user({{user.id}})">
<img src={{user.profile_img}} class=user-image>
...
</div>
我收到此错误
无法绑定到“ng-click”，因为它不是“div”的已知属性。("
<div class="user" *ngFor="let user of arrUsers" [ERROR ->]ng-click="open_user({{user.id}})">
在任何地方都找不到解决方案..
PS 角度的新手
我有一个 NG-Click 来更改页面上的元素数量（来自 API 调用）。NG-Click 使用在 FireFox 中工作的下拉框。但我最近发现，当同事开始使用该服务时，它在 Chrome 中不起作用。我不知道为什么它不起作用，任何帮助表示赞赏。我附上了一个带有代码的 JSFidle。
JavaScript：
app.controller("AppCtrl", function($http, $scope){
var app = this;
$scope.toLoad=50;
$scope.page= 0;
$scope.sortArray = [];
$scope.filterList = "";
function getData(page){
$http.get('/file/filter/' + $scope.toLoad + '/' + $scope.page + '?' + $scope.filterList ).success(function(data){
app.info = data;
console.log(data);
});
}
$scope.changeLoad = function(toLoad){
$scope.toLoad = toLoad;
getData($scope.page)
}
}
HTML：
<body ng-app="app" ng-controller="AppCtrl as app" id="body">
<div id="main-table">
<div class="widget-body no-padding">
<div id="select-more">
<select class="form-control" name="dt_basic_length" aria-controls="dt_basic" id="box-test" style="width:6%">
<option value="10" …