добавление нового контроллера AngularJS на главную страницу с помощью usercript - PullRequest
Новая
       8

добавление нового контроллера AngularJS на главную страницу с помощью usercript

0 голосов
/ 01 октября 2018

Я пытаюсь разработать сценарий для онлайн-игры.Они используют angularJS на своих страницах.

Можно ли присоединить мой угловой контроллер, написанный в usercript, работающий в tampermonkey?Вот часть моего кода: 

// ==UserScript==
// @name        Inventory extras
// @version     0.1
// @include     gameurl.com/*/economy/inventory
// @description Table with licenses and taxes in the inventory. Scan for prices in sortable table.  Also checks for the old license bug, when aliens are on top of the list of sellers. Now with job offers.
// @namespace   myNamespace
// ==/UserScript==

var $ = jQuery;

function AddStyle(t) {
    $("head").append("<style>" + t + "</style>");
}

(function() {
    'use strict';
    $("#sell_offers").after('<div class="taxTable" style="display: block;" ng-app="mainApp" ng-controller="licensesController">' + '<table id="licenses" width="100%">' + "<thead>" + "<tr>" + '<th style="height: 40px; text-align: center; padding-left: 0px;"> </th>" + "</tr>" + "</thead>" + "<tbody></tbody>" + "</table>" + "</div>");
    $("#inventory_overview .taxTable table tbody").append("<tr ng-repeat='country in countries'><td style='padding-left: 5px;' colspan='9'>{{ 'Country: ' + country.name + ', Locale: ' + country.locale }}</td></tr>");

    var mainApp = angular.module("mainApp", []);
    mainApp.controller('licensesController', function($scope) {
    $scope.countries = [{locale:'en-US',name:'United States'}, {locale:'en-GB',name:'United Kingdom'}, {locale:'en-FR',name:'France'}]
    });

})();

Код вырезан для примера и может содержать некоторые ошибки.Что я должен вызывать для выполнения своих функций на странице хоста?

Да, я начал читать учебные пособия, но не смог найти ничего о tampermonkey и angularJS.

Edit1: 

$("#sell_offers").after('<div ng-controller="MyController"> Hello {{greetMe}}! </div>'); 
angular.module('myApp', []) 
    .controller('MyController', [
        '$scope', function ($scope) {
             $scope.greetMe = 'World';
        }
    ]);
    angular.element(function() { 
        angular.bootstrap(document, ['myApp']);
    });
})();

Все еще не работает.angular.min.1488804924.js: 6 Uncaught Error: [ng: btstrpd] http://errors.angularjs.org/1.6.2/ng/btstrpd?p0=%26lt%3Bdiv%20id%3D%22myApp%22%26gt%3B

Edit2:

Ни то, ни другое 

var $ = jQuery;
var ErpkApp = unsafeWindow.ErpkApp;

function AddStyle(t) {
    $("head").append("<style>" + t + "</style>");
}

(function() {
    'use strict';
    $("#sell_offers").after('<div id="myTest" ng-controller="MyController"> Hello {{greetMe}}! </div>');
    ErpkApp.controller('MyController', [
        '$scope', function ($scope) {
            $scope.greetMe = 'World';
        }
    ]);
})();

Я использовал ErpkApp на главной странице, потому что <html ng-app="ErpkApp" lang="en">

или 

var $ = jQuery;

function AddStyle(t) {
    $("head").append("<style>" + t + "</style>");
}

(function() {
    'use strict';
    $("#sell_offers").after('<div id="myTest" ng-controller="MyController"> Hello {{greetMe}}! </div>');
    var app = angular.module('ErpkApp', []);

    app.controller('MyController', [
        '$scope', function ($scope) {
            $scope.greetMe = 'World';
        }
    ]);
})();

работает.

Edit3: 

var $ = jQuery;

function AddStyle(t) {
    $("head").append("<style>" + t + "</style>");
}

(function() {
    'use strict';
    $("#sell_offers").after('<div id="myTest"><div ng-controller="MyController"> Hello {{greetMe}}! </div></div>');
    var app = angular.module('myApp', []);

    app.controller('MyController', [
        '$scope', function ($scope) {
            $scope.greetMe = 'World';
        }
    ]);

    angular.bootstrap($('#myTest'), ['myApp']);
})();

Я думаю, что должен сдаться.Я читал, что угловые не позволяют вложения приложений.На главной странице html уже загружен, поэтому я не могу прикрепить новое приложение ниже.

...