Question

所以...嘿大家，v另一个问题......目前我正在建立自己的网站博客（从头开始，用于自我教育），其中包含一些有趣的员工和一些聪明的东西（如文章）使用我的代码），现在它只是一个由于Angular.js而工作的静态网站。有一天，RoR会在后端变得充满活力，但是，没关系，现在关于我昨天遇到的问题。例如：我有所有'聪明'帖子的路线如下：

.state('smartStuff', {
  url: '/smartStuff',
  views: {
    'content': {
      templateUrl: 'html/smartStuff.html',
      controller: 'SmartStuffController'
    }
  }
})

然后，单个帖子的页面动态创建：

.state('postsAboutSmartStuff', {
  url: '/smartStuff/{smartStuffPostId}',
  views: {
    'content': {
      templateUrl: 'html/post.html',
      controller: 'SmartStuffController'
    }
  }
})

我通过服务从JSON获得的每篇文章中代表的内容......

angular.module('postsServices', [])
.factory('postsFactory', function($http) {
    var promise;
    return {
        all: function() {
            if(!promise) {
                promise = $http.get('postsSmartStuff.json')
                    .then(function(response) {
                        return response.data;
                    })
            }
            return promise;
        }
    }
});

然后控制器......就像：

var postsControllers = angular.module('postsControllers', []);
postsControllers.controller('SmartStuffController', function($scope, postsFactory, $stateParams) {
  postsFactory.all()
      .then(function(posts) {
          $scope.posts = posts;
          $scope.smartStuffPostId = $stateParams.smartStuffPostId;

          function getById(arr, id) {
             for (var i = 0; i < arr.length; i++) {
                  if (arr[i].id == id) {
                      return arr[i];
                  }
             }
          }
          $scope.singlePost = getById($scope.posts, $stateParams.smartStuffPostId);

      });
});

所有工作都很精细！当我的JSON看起来像：

[{
    "id": 1,
    "theme": "vanilla javascript",
    "title": "Post 2",
    "description": "Description two"
 },
 {...}, 
]

我的意思是当我'给'我的JSON只是TEXT。但是正如我已经提到的那样 - 我想要并且在我的文章中写出一些实际的代码......所以，最后，我的问题 - 如何我可以传递任何实际代码，然后在Angular的控制器中正确解析吗？我感觉传递这样的代码（函数，wateva）是非常糟糕的做法，但现在我没有看到其他解决方案。我只是学习如此抱歉，任何体面的帮助将不胜感激。希望我让自己绝对清楚：）

Answer 1

最简单的方法是将文本实际存储为Markdown，然后使用降价指令（如下所示：https://github.com/btford/angular-markdown-directive）来显示所有文本。

/ *更新* / 要清楚，我的意思是你的内容应该在Markdown中。因此，每个帖子仍然是某种JSON对象，但是您用来表示帖子正文的数据元素（从上面不清楚）或帖子的任何其他应该具有格式化内容的部分都应该在Markdown中，然后传递给Angular指令，该指令可以将Markdown转换为HTML。

例如，您可能有一个JSON对象，如：

{
    "id": 1,
    "theme": "vanilla javascript",
    "title": "Post 2",
    "description": "Description two",
    "content" : "Hey, I have some awesome content here: ```var t = 'awesome'; alert(t); ```"
 }

然后你就像你已经那样获取它，但是当你实例化angular-markdown-directive时，你将该指令绑定到你的内容：

<!-- Assuming 'content' is in the current scope; might have to be singlePost.content or something else --> 
<div btf-markdown="content">
</div>

或可能：

<btf-markdown>{{singlePost.content}}</btf-markdown>

传递然后解析Angular.js中JSON的代码示例

1 个答案: