Как интегрировать Angularjs и Salesforce?

Я пытаюсь проверить пример приложения Angularjs в Salesforce. Когда я тестирую, он работаетКак интегрировать Angularjs и Salesforce?

grunt serve

в моем браузере, он отлично работает. Поэтому я помещаю код на страницу Visualforce, и он не отображает все содержимое правильно. Похоже, что это проблема с частью #/и $ routeProvider.

код (начальный код углового генератора от Yeoman) в моей странице Visualforce:

<head> 
    <meta charset="utf-8"> 
    <title></title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width"> 
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" /> 
    <link rel="stylesheet" href="styles/main.css"> 
</head> 
<body ng-app="griApp"> 
    <div class="header"> 
     <div class="navbar navbar-default" role="navigation"> 
      <div class="container"> 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#js-navbar-collapse"> 
         <span class="sr-only">Toggle navigation</span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
        <a class="navbar-brand" href="#/">gri</a> 
       </div> 
       <div class="collapse navbar-collapse" id="js-navbar-collapse"> 
        <ul class="nav navbar-nav"> 
         <li class="active"><a href="#/">Home</a></li> 
         <li><a ng-href="#/about">About</a></li> 
         <li><a ng-href="#/">Contact</a></li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    </div> 
    <div class="container"> 
     <div ng-view=""></div> 
    </div> 
    <div class="footer"> 
     <div class="container"> 
      <p><span class="glyphicon glyphicon-heart"></span> from the Yeoman team</p> 
     </div> 
    </div> 
    <script src="bower_components/jquery/dist/jquery.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script> 
    <script src="bower_components/angular-animate/angular-animate.js"></script> 
    <script src="bower_components/angular-aria/angular-aria.js"></script> 
    <script src="bower_components/angular-cookies/angular-cookies.js"></script> 
    <script src="bower_components/angular-messages/angular-messages.js"></script> 
    <script src="bower_components/angular-resource/angular-resource.js"></script> 
    <script src="bower_components/angular-route/angular-route.js"></script> 
    <script src="bower_components/angular-sanitize/angular-sanitize.js"></script> 
    <script src="bower_components/angular-touch/angular-touch.js"></script> 
    <script src="scripts/app.js"></script> 
    <script src="scripts/controllers/main.js"></script> 
    <script src="scripts/controllers/about.js"></script> 
</body>

В моем реальном коде я правильно используя URLFOR включить файлы статического ресурса.

Моего app.js является:

angular 
    .module('griApp', [ 
    'ngAnimate', 
    'ngAria', 
    'ngCookies', 
    'ngMessages', 
    'ngResource', 
    'ngRoute', 
    'ngSanitize', 
    'ngTouch' 
    ]) 
    .config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainCtrl', 
     controllerAs: 'main' 
     }) 
     .when('/about', { 
     templateUrl: 'views/about.html', 
     controller: 'AboutCtrl', 
     controllerAs: 'about' 
     }) 
     .otherwise({ 
     redirectTo: '/' 
     }); 
    });

Надеется, что вы можете мне помочь.

Спасибо!

источник

2016-01-19 Nicolás Batistoni

Необходимо быть более конкретным относительно того, что на самом деле происходит. Любые ошибки в консоли? Изменяет ли url ожидаемый путь '# /'? Если так, что тогда происходит? Если нет, что происходит? – charlietfl

Спасибо @charlietfl! В консоли нет ошибок. URL правильно изменится. На данный момент ничего не происходит. Но для каждого параметра меню он должен отображать разные тексты. Я искал и пытаюсь привести примеры интеграции Angular With Salesforce, но мне это пока не удалось. Я подозреваю, что проблема может быть в $ routerProvider, в представлениях. В этот момент маршрут не назначен URLFor, и я думаю, что он также может быть неправильным. –

Я не знаю salesforce, но поскольку угловые маршруты основаны на хеше, сервер только когда-либо знает о URL главной страницы. Проверьте сеть инструментов браузера. Мое предположение было бы путями шаблонов, нужно будет модифицировать, но не уверен – charlietfl

У меня встроенный salesforce и angularjs. Я создал компоненты Apex, соответствующие каждой странице, и разместил html-контент в ngTemplate и загрузил через $ templateCache.

поэтому моя страница Visualforce приложение выглядит следующим образом

<apex:component controller="APTS_ApttusLabAngularJS"> 

    <script type="text/ng-template" id="name.html"> 
     <!-- include your html and refer this name.html in your route 
    </script> 

</apex:component>

Я бы посоветовал вам использовать stateProvider вместо.

источник

2018-02-11 17:07:17

Как интегрировать Angularjs и Salesforce?

ответ

Смежные вопросы