Javascript 与控制器和自定义指令相关的角度js_Javascript_Angularjs

Javascript 与控制器和自定义指令相关的角度js

javascript angularjs

Javascript 与控制器和自定义指令相关的角度js,javascript,angularjs,Javascript,Angularjs,我只需要两个div中的不同内容当我更改控制器对象中的数据时，它应该反映在div中。这是我的html代码 <!DOCTYPE html> <html ng-app="myApp"> <head> ***emphasized text*** <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/f

我只需要两个div中的不同内容当我更改控制器对象中的数据时，它应该反映在div中。这是我的html代码

 <!DOCTYPE html>
    <html ng-app="myApp">
    <head>
    ***emphasized text***
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="angular-gridster.min.css"></link>
    <link rel="stylesheet" href="wid.css"></link>
    </head>
    <body   ng-controller="myController" >
      <div gridster  ng-controller="myCtrl"  > 
        <ul>
          <li gridster-item="item" ng-repeat="item in Items">
            <div my-widget ></div>
          </li>
        </ul>
      </div>
    </body>

</html>

我的

备用html

如下-

<span ng-controller="myCtrl">
<div class="panel-body "   ng-style = "myStyle">
    <h1  class="title" >{{content.title}}</h1>
    <i class="fa fa-dollar" ></i>{{content.data}}</div>
     <p id="rightcorner" ><i class="fa fa-level-up"></i>{{content.right}} 
     </p>
    </span>


{{content.title}
{{content.data}
{{content.right}

我需要的是在2个div中，我应该获得单独的数据，即在控制器对象中给定

此处输入code

您的指令正在使用一个独立的作用域（

作用域：{title:'@'，data:'='}

）。这就是为什么它不能访问父作用域的

内容

数组（这通常是件好事）

您要做的是将

$scope.content

项传递给

my widget

指令

您可以使用

ngRepeat

范围的

$index

变量

<li gridster-item="item" ng-repeat="item in Items">
    <div my-widget data="content[$index]"></div>
</li>

顺便说一下，

title

对于属性来说是个坏名字，因为它是一个html属性

编辑：如评论中所述，添加了单个控制器解决方案的示例代码

angular.module（'app'，[]）
.controller（'myController'，myController）
.指令（“myWidget”，myWidget）；
函数myController（）{
var vm=这个；
vm.items=[
{
标题：“1”，
obj:{data:123}
},
{
标题：“2”，
obj:{数据：234}
}];
}
函数myWidget（）{
返回{
范围：{
数据：'我可以删除“myctrl”并将该对象添加到“mycontroller”中吗这意味着我只需要使用一个控制器就可以了@hansmayes当然，只需将内容
放入mycontroller
并删除myctrl，如果这更适合您的需要，我已经尝试过了，但对我不起作用。你能帮我解决这个类似$scope.Items=[{sizeX:2，sizeY:1，行：0，列：0，obj:{data:54565463，right:67566，title:'headers'}，{sizeX:2，sizeY:1，行：0，列：0，obj:{data:65476756，right:123，title:'Income'，}]但它仍然不适用于任何人me@Bunty我添加了一个示例。我相信您能够找出，如何根据您的需要翻译此示例。现在我需要的是希望看到每个div中的字体大小不同，并且应该只在object中传递@hansmad
<li gridster-item="item" ng-repeat="item in Items">
    <div my-widget data="content[$index]"></div>
</li>

<div class="panel-body">
<h1  class="title" >{{title}}</h1>
<i class="fa fa-dollar" ></i>{{data.data}}
</div>
 <p id="rightcorner"><i class="fa fa-level-up"></i>{{data.right}} 
 </p>