如何访问对象本身是一个角度JSON文件的数组内里的数组? [英] How to access an array inside an object which itself is inside an array of a json file in Angular?

查看:233
本文介绍了如何访问对象本身是一个角度JSON文件的数组内里的数组?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我的控制器角code ,然后除 $ scope.Product ,我无法访问一切正常产品细节(样机和产品细节和其下的数组是HTML code,我想添加的访问产品细节和迭代它内部的 NG-重复

\r
\r

.controller('aboutCtrl',函数($范围,aboutService){\r
        VAR承诺= aboutService.getAbout();\r
        promise.then(功能(RCDATA){\r
            $ scope.about = rcdata.data.about;\r
            $ scope.products = rcdata.data.products;\r
            $ scope.mobileProduct = rcdata.data.mobileProduct;\r
            $ scope.clients = rcdata.data.clients;\r
            $ scope.anytime = rcdata.data.anytime;\r
            $ scope.lobProduct = rcdata.data.lobProduct;\r
            $ scope.Product = rcdata.data.lobProduct.projectsdetails;\r
        });\r
    })

\r

<节类=产品细节填充>\r
        < D​​IV CLASS =容器>\r
            < D​​IV CLASS =行>\r
                < D​​IV CLASS =COL-MD-6的数据-NG-重复=产品详细介绍产品中的>\r
                    < D​​IV CLASS =prdct-D>\r
                        < IMG类=IMG响应SRC =< PHP的echo $ IMG;>计算机/ {{detial.mockup}}>\r
                        &所述p为H.;\r
                            {{detail.description}}\r
                        &所述; / P>\r
                    < / DIV>\r
                < / DIV>\r
            < / DIV>\r
        < / DIV>\r
    < /段>

\r

\r
\r这里是JSON文件
\r
\r

{\r
    产品:[\r
        {\r
            图标:flaticon计算机,\r
            头衔:行当,\r
            说明:于提供一流的数据业务应用的驱动线,是关键任务软件,具体到企业根洞重点据我们了解,在复杂的Web应用程序,帮助用户做用户体验和设计简洁界面的需求和期望少花钱多办事。\r
        },\r
        {\r
            图标:flaticon技术-2\r
            头衔:Mopile应用程序,\r
            说明:移动设备正在越来越多地用于访问内容,并与品牌进行互动所以,关键是你有一个精心设计和扎实执行移动体验根洞穿过,并在整个定制的移动网站和为客户提供品牌的一致性。应用。\r
        }\r
    ]\r
   \r
    关于: [\r
        {\r
            图标:1-sales.png\r
            头衔:销售,\r
            说明:销售由根洞CRM提供了完整而直观的解决方案,可以帮助销售人员提高工作效率,使他们能够专注于什么是最重要的,提供惊人的客户体验。\r
        },\r
\r
        {\r
            图标:2-cs.png\r
            头衔:服务\r
            说明:由根洞CRM服务通过自己选择的自我和辅助服务选项使客户;授权代理商提供快速,明智和有效的解决方案;并无缝集成领域的解决方案时,有必要进行现场帮助我们灵活的解决方案。轻松适应不断变化的需求,使您的企业可以在一个安全,灵活和可靠的环境中提供的意图驱动的结果。\r
        },\r
\r
        {\r
            图标:三marketing.png\r
            头衔:市场营销,\r
            说明:根洞营销是市场化运作,规划,执行和分析所有的整合营销资源管理解决方案渠道 - 电子邮件,数字,社交,短信,和传统。\r
        },\r
\r
        {\r
            图标:4-financials.png\r
            头衔:财经\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:5 hr.png\r
            头衔:人力资源,\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:6-ecommerce.png\r
            头衔:电子商务,\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:7-school.png\r
            头衔:学校,\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:8 medical.png\r
            头衔:医疗,\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        }\r
    ]\r
\r
    任何时候: [\r
        {\r
            图标:box.png\r
            头衔:标题下面\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:clock.png\r
            头衔:标题下面\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            图标:cloud.png\r
            头衔:标题下面\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        }\r
    ]\r
\r
    顾客:\r
        {\r
            clinetLogo:logoclient.png\r
        },\r
\r
        {\r
            clinetLogo:logoclient.png\r
        },\r
\r
        {\r
            clinetLogo:logoclient.png\r
        },\r
\r
        {\r
            clinetLogo:logoclient.png\r
        },\r
\r
        {\r
            clinetLogo:logoclient.png\r
        },\r
\r
        {\r
            clinetLogo:logoclient.png\r
        }\r
    ]\r
\r
    lobProduct:[\r
        {\r
            样机:1(1)巴纽\r
            ID:0,\r
            tDesc:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            头衔:你好,\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            projectsdetails:[\r
                {\r
                    mockup_details:1(1).PNG,\r
                    description_details:你好0 Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria。等,nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(2).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(3).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(4).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                }\r
            ]\r
        },\r
\r
        {\r
            样机:1(1)巴纽\r
            标识:1,\r
            tDesc:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            头衔:此标题\r
            说明:。你好存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            projectsdetails:[\r
                {\r
                    mockup_details:1(1).PNG,\r
                    description_details:。产品1喜everti UT PRI Recusabo periculis patrioque的二人SUAS alienum在EOS在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等,nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(2).PNG,\r
                    description_details:喜2存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等。 ,nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(3).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(4).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                }\r
            ]\r
        },\r
\r
        {\r
            样机:1(1)巴纽\r
            ID:2,\r
            tDesc:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            头衔:此标题\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            projectsdetails:[\r
                {\r
                    mockup_details:1(1).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(2).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(3).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(4).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                }\r
            ]\r
        },\r
\r
        {\r
            样机:1(1)巴纽\r
            ID:3,\r
            tDesc:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            头衔:此标题\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
            projectsdetails:[\r
                {\r
                    mockup_details:1(1).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(2).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(3).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                },\r
\r
                {\r
                    mockup_details:1(4).PNG,\r
                    description_details:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
\r
                }\r
            ]\r
        }\r
    ]\r
\r
\r
    mobileProduct:[\r
        {\r
            ID:1\r
            头衔:标题下面\r
            样机:拇指滑块画像-3-OPT-501x900.png\r
            说明:。1111Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            ID:1\r
            头衔:标题下面\r
            样机:拇指滑块画像-3-OPT-501x900.png\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            ID:1\r
            头衔:标题下面\r
            样机:拇指滑块画像-3-OPT-501x900.png\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        },\r
\r
        {\r
            ID:1\r
            头衔:标题下面\r
            样机:拇指滑块画像-3-OPT-501x900.png\r
            说明:。Lorem存有悲坐阿梅德,PERFECTO accusata广告魁,阿梅特adhuc everti UT PRI Recusabo periculis patrioque的二人SUAS alienum EOS在,在NIBH soleat nostrud梅尔铕EAM alii圣哉sadipscing,EOS nusquam voluptaria等, nominati volutpat maiestatis有EI。\r
        }\r
    ]\r
\r
}

\r

\r
\r


解决方案

< ====== ANGULAR CODDE ==>

  .controller('aboutCtrl',函数($范围,aboutService){
        VAR承诺= aboutService.getAbout();
        promise.then(功能(RCDATA){
            $ scope.about = rcdata.data.about;
            $ scope.products = rcdata.data.products;
            $ scope.mobileProduct = rcdata.data.mobileProduct;
            $ scope.clients = rcdata.data.clients;
            $ scope.anytime = rcdata.data.anytime;
            $ scope.lobProduct = rcdata.data.lobProduct;
            $ scope.Product = rcdata.data.lobProduct.projectsdetails;
        });
    })

< ====== HTML CODDE ==>

 <节类=产品细节填充>
    < D​​IV CLASS =容器>
        < D​​IV CLASS =行>
            < D​​IV CLASS =COL-MD-6的数据-NG-重复=,在产品细节>
                < D​​IV CLASS =prdct-D>
                    < IMG类=IMG响应SRC =< PHP的echo $ IMG;>计算机/ {{detial.mockup}}>
                    &所述p为H.;
                        {{detail.description}}
                    &所述; / P>
                < / DIV>
            < / DIV>
        < / DIV>
    < / DIV>
< /节>

我改变什么:这是在你的数据-NG重复一个错字错=产品详细介绍的产品键,我改成了数据-NG-重复=详细的产品

感谢和放大器;干杯

This is my controller Angular code, and everything is working fine except the $scope.Product, I can't access the array of product details (mockup and product details and under it is the html code which I wish to add the accessed product details and iterate it inside an ng-repeat

 .controller('aboutCtrl', function ($scope, aboutService) {
        var promise = aboutService.getAbout();
        promise.then(function (rcdata) {
            $scope.about = rcdata.data.about;
            $scope.products = rcdata.data.products;
            $scope.mobileProduct = rcdata.data.mobileProduct;
            $scope.clients = rcdata.data.clients;
            $scope.anytime = rcdata.data.anytime;
            $scope.lobProduct = rcdata.data.lobProduct;
            $scope.Product = rcdata.data.lobProduct.projectsdetails;
        });
    })

    <section class="product-detail padding">
        <div class="container">
            <div class="row">
                <div class="col-md-6" data-ng-repeat="detial in Product">
                    <div class="prdct-d">
                        <img class="img-responsive" src="<?php echo $img; ?>Computer/{{detial.mockup}}">
                        <p>
                            {{detail.description}}
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </section>

and here is the json file

{
    "products": [
        {
            "icon": "flaticon-computer",
            "title": "Line Of Business",
            "description": "Root Cave focus on delivering top notch data driven line of business application which are mission critical software specific to the business. We understand the needs and expectations for the user experience and design simple interfaces for complex web applications that help users do more with less."
        },
        {
            "icon": "flaticon-technology-2",
            "title": "Mopile App",
            "description": "Mobile devices are increasingly utilized to access content and interact with brands. So, it is critical that you have a well-designed and solidly executed mobile experience. Root Cave provides clients with brand consistency through and throughout customized mobile websites and applications."
        }
    ],
   
    "about": [
        {
            "icon":"1-sales.png",
            "title":"Sales",
            "description": "Sales by Root Cave CRM provides a complete and intuitive solution that can help salespeople be more productive so they can focus on what's most important—delivering amazing customer experiences."
        },

        {
            "icon":"2-cs.png",
            "title":"Service",
            "description": "Service by Root Cave CRM empowers customers through their choice of self and assisted service options; empowers agents to deliver fast, informed and effective resolutions; and seamlessly incorporates field solutions when there is a need for onsite help. Our agile solutions easily adapt to changing demands so that your business can deliver intent driven outcomes in a secure, flexible and reliable environment.."
        },

        {
            "icon":"3-marketing.png",
            "title":"Marketing",
            "description": "Root Cave Marketing is an integrated marketing resource management solution for marketing operation, planning, execution, and analytics across all channels—email, digital, social, SMS, and traditional."
        },

        {
            "icon":"4-financials.png",
            "title":"Finance",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"5-hr.png",
            "title":"Human Resources",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"6-ecommerce.png",
            "title":"Ecommerce",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"7-school.png",
            "title":"School",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"8-medical.png",
            "title":"Medical",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        }
    ],

    "anytime": [
        {
            "icon":"box.png",
            "title":"Title Here",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"clock.png",
            "title":"Title Here",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "icon":"cloud.png",
            "title":"Title Here",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        }
    ],

    "clients": [
        {
            "clinetLogo": "logoclient.png"
        },

        {
            "clinetLogo": "logoclient.png"
        },

        {
            "clinetLogo": "logoclient.png"
        },

        {
            "clinetLogo": "logoclient.png"
        },

        {
            "clinetLogo": "logoclient.png"
        },

        {
            "clinetLogo": "logoclient.png"
        }
    ],

    "lobProduct": [
        {
            "mockup": "1 (1).png",
            "id": 0,
            "tDesc": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "title": "Hello",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "projectsdetails": [
                {
                    "mockup_details": "1 (1).png",
                    "description_details": "Hello 0 Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (2).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (3).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (4).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                }
            ]
        },

        {
            "mockup": "1 (1).png",
            "id": 1,
            "tDesc": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "title": "title here",
            "description": "hello ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "projectsdetails": [
                {
                    "mockup_details": "1 (1).png",
                    "description_details": "product 1 Hi  everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (2).png",
                    "description_details": "Hi 2 ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (3).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (4).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                }
            ]
        },

        {
            "mockup": "1 (1).png",
            "id": 2,
            "tDesc": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "title": "title here",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "projectsdetails": [
                {
                    "mockup_details": "1 (1).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (2).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (3).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (4).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                }
            ]
        },

        {
            "mockup": "1 (1).png",
            "id": 3,
            "tDesc": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "title": "title here",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei.",
            "projectsdetails": [
                {
                    "mockup_details": "1 (1).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (2).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (3).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                },

                {
                    "mockup_details": "1 (4).png",
                    "description_details": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."

                }
            ]
        }
    ],


    "mobileProduct": [
        {
            "id": "1",
            "title": "Title Here",
            "mockup": "thumb-slider-portrait-3-opt-501x900.png",
            "description": "1111Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "id": "1",
            "title": "Title Here",
            "mockup": "thumb-slider-portrait-3-opt-501x900.png",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "id": "1",
            "title": "Title Here",
            "mockup": "thumb-slider-portrait-3-opt-501x900.png",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        },

        {
            "id": "1",
            "title": "Title Here",
            "mockup": "thumb-slider-portrait-3-opt-501x900.png",
            "description": "Lorem ipsum dolor sit amet, perfecto accusata ad qui, amet adhuc everti ut pri. Recusabo periculis patrioque an duo. Suas alienum eos at, at nibh soleat nostrud mel. Eu eam alii sanctus sadipscing, eos nusquam voluptaria et, nominati volutpat maiestatis has ei."
        }
    ]

}

解决方案

<======ANGULAR CODDE======>

.controller('aboutCtrl', function ($scope, aboutService) {
        var promise = aboutService.getAbout();
        promise.then(function (rcdata) {
            $scope.about = rcdata.data.about;
            $scope.products = rcdata.data.products;
            $scope.mobileProduct = rcdata.data.mobileProduct;
            $scope.clients = rcdata.data.clients;
            $scope.anytime = rcdata.data.anytime;
            $scope.lobProduct = rcdata.data.lobProduct;
            $scope.Product = rcdata.data.lobProduct.projectsdetails;
        });
    })

<======HTML CODDE======>

<section class="product-detail padding">
    <div class="container">
        <div class="row">
            <div class="col-md-6" data-ng-repeat="detail in Product">
                <div class="prdct-d">
                    <img class="img-responsive" src="<?php echo $img; ?>Computer/{{detial.mockup}}">
                    <p>
                        {{detail.description}}
                    </p>
                </div>
            </div>
        </div>
    </div>
</section>

What I Changed : it was a typo mistake in your data-ng-repeat="detial in Product" And i Changed it to data-ng-repeat="detail in Product".

Thanks & Cheers

这篇关于如何访问对象本身是一个角度JSON文件的数组内里的数组?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆